Uklonite html oznake. Obrišite tekst iz html oznaka. Kako radi html cleaner?

Zdravo!

Kada sam pisao svoj WYSIWYG editor, naišao sam na problem kopiranja teksta iz Worda. Zapravo postoje tri problema:

  • Word ubacuje mnogo neželjenog html koda koji treba očistiti
  • Iz nekog razloga, Word koristi paragrafe umjesto UL i LI oznaka za predstavljanje lista
  • Zapravo, kako odrediti da je umetnuti tekst umetnut iz Worda.
Općenito, za rješavanje ovih problema, jquery dodatak je napisan, kompletan izvor koji je dostupan na kraju članka. Primjer upotrebe:

$('#editor'). msword_html_filter();
Dodatak je okačen na događaj keyup i provjerava da li je izvorni kod unutar uređivača zalijepljen iz Worda; ako jeste, onda se pokreće funkcija čišćenja. U rezultujućem html-u, sve moguće je zakucano - neprekidni prostori, atributi stil I poravnati, oznake raspon, Sve Mso- klase, prazni paragrafi.

Detalji implementacije ispod reza.

Većina korištenih regularnih proizvoda preuzeta je iz TinyMCE-a.

Kako odrediti da li linija sadrži html kod umetnut iz Worda:

Ako (/class="?Mso|style="[^"]*\bmso-|style="[^""]*\bmso-|w:WordDocument/i.test(content)) ( ... )

Funkcija čišćenja koda (proslijeđena na funkciju jquery objekat urednik):

Funkcija word_filter(editor)( var content = editor.html(); // Word komentari poput uvjetnih komentara itd. content = content.replace(/<(!|script[^>]*>.*?<\/script(?=[>\s])|\/?(\?xml(:\w+)?|img|meta|link|style|\w:\w+)(?=[\s\/>]))[^>]* >>gi, ""); // Pretvoriti into <(\/?)s>/gi,"<$1strike> ___ ([\s\u00a0]*)<\/span>/gi, funkcija(str, razmaci) (vraćanje (razmaci.dužina > "; if (/^\s*\w+\./.test(txt)) (var odgovara = /()\./.exec(txt ); if (podudaranja) ( var start = parseInt(podudaranja, 10); list_tag = početak>1 ? "" : ""; )else( list_tag = ""; ) ) if(cur_level> " + $(ovo).html() + "") $(this).remove(); last_level = cur_level; )else( last_level = 0; ) )) $("", editor).removeAttr("style"); $("", editor).removeAttr( "align"); $("span", editor).replaceWith(function() (vrati $(this).contents();)); $("span:empty", editor).remove(); $( "", editor).removeAttr("class"); $("p:empty", editor).remove(); )

Potpuni izvorni tekst dodatka je ispod spojlera, sačuvajte ga u fajlu jquery.msword_html_filter.js

izvorni tekst dodatka

(function($) ( $.fn.msword_html_filter = funkcija (opcije) (var settings = $.extend(), options); function word_filter(editor)(var content = editor.html(); // Word komentari poput uslovni komentari itd content = content.replace(//gi, ""); // Uklonite komentare, skripte (npr. msoShowComment), XML oznaku, VML sadržaj, // MS Office oznake prostora imena i nekoliko drugih oznaka content = content.replace(/<(!|script[^>]*>.*?<\/script(?=[>\s])|\/?(\?xml(:\w+)?|img|meta|link|style|\w:\w+)(?=[\s\/>]))[^>]* >>gi, ""); // Pretvoriti into za line-though content = content.replace(/<(\/?)s>/gi,"<$1strike>"); // Zamijenite nbsp entite u char jer je lakše rukovati //content = content.replace(/ /gi, "\u00a0"); sadržaj = content.replace(/ /gi, " "); // Pretvoriti ___ na niz naizmjeničnih // prekidnih/neprekidajućih razmaka iste dužine content = content.replace(/ ([\s\u00a0]*)<\/span>/gi, funkcija (str, razmaci) ( povratak (razmaci.dužina > 0) ? spaces.replace(/./, " ").slice(Math.floor(spaces.length/2)).split("") .join("\u00a0") : ""; )); editor.html(sadržaj); // Raščlanjujemo nivo uvlake liste za liste $("p", editor).each(function())( var str = $(this).attr("style"); var odgovara = /mso-list:\w+ \ w+(+)/.exec(str); if (podudara se) ( $(this).data("_listLevel", parseInt(podudaranja, 10)); ) )); // Parsiraj liste var last_level=0; var pnt = null; $("p", editor).each(function())(var cur_level = $(this).data("_listLevel"); if(cur_level != undefined)(var txt = $(this).text() ; var list_tag = ""; if (/^\s*\w+\./.test(txt)) (var odgovara = /()\./.exec(txt); if (podudara) (var start = parseInt (podudaranja, 10); list_tag = početak>1 ? "" : ""; )else( list_tag = ""; ) ) if(cur_level>last_level)( if(last_level==0)( $(this).before( list_tag ); pnt = $(this).prev(); )else(pnt = $(list_tag).appendTo(pnt); ) ) if(cur_level " + $(ovo).html() + "") $(this).remove(); last_level = cur_level; )else( last_level = 0; ) )) $("", editor).removeAttr("style"); $("", editor).removeAttr( "align"); $("span", editor).replaceWith(function() (vrati $(this).contents();)); $("span:empty", editor).remove(); $( "", editor).removeAttr("class"); $("p:empty", editor).remove(); ) vrati this.each(function() ( $(this).on("keyup", funkcija ()( var content = $(this).html(); if (/class="?Mso|style="[^"]*\bmso-|style="[^""]*\bmso-|w :WordDocument/i.test(content)) ( word_filter($(this)); ) )); )); ); ))(jQuery)


Performanse su testirane samo u najnovijem Firefoxu.

Excel/Word to HTML je idealan alat za uređivanje izvornog koda WordPress članaka ili bilo kojeg drugog sistema za upravljanje sadržajem kada njihov ugrađeni kompozitor ne pruža sve funkcije koje su nam potrebne. Sastavite sadržaj direktno u prozoru vašeg pretraživača bez instaliranja ekstenzije ili dodatka za rukovanje isticanjem sintakse i drugim funkcijama za uređivanje teksta.

Kako koristiti?

Zalijepite dokument koji želite da konvertujete u Word uređivač, a zatim idite na HTML preglednik koristeći velike kartice na vrhu stranice da generišete kod.

Očistite prljave oznake pomoću velikog dugmeta koje izvršava aktivne (označene) opcije na listi. Također možete primijeniti ove funkcije jednu po jednu pomoću ikone CLEAN.

Problemi konverzije koji se lako rješavaju našim online HTML konverterom

Problem pretvaranja riječi u html vjerovatno je uvijek postojao zajedno sa Microsoft Wordom. Ogroman broj stilova dodijeljenih tekstovima, kao što je mso-spacerun:yes, i klasa, kao što je MsoNormal, kao i nered svih vrsta span style="font-size:10.0pt" uvelike ometaju kod. I često prekidaju izvorne stilove navedene na web lokaciji. Ako još uvijek možete rukovati jednostavnim tekstom umetanjem teksta kroz uređivačevo dugme "Umetni samo tekst", onda ova metoda neće raditi s tabelama. Naš konverter je u mogućnosti da jednostavno očisti sve nepotrebne komentare i stilove iz buduće html datoteke, jednostavnim klikom na dugmad.


Online čišćenje HTML-a od nepotrebnih CSS stilova
  • Uklonite sve nepotrebne stilove iz cijelog teksta ili odabranog fragmenta
  • Uklanjamo nepotrebne kodove za uvlačenje, simbole i druge Unicode kodove
  • Očistite kod od dodatnih razmaka i duplih oznaka
  • Ako je potrebno, potpuno uklonite HTML oznaku.

Pretvorite Word, Excel, TxT datoteke u čist HTML izvorni kod. Bez nepotrebnih stilova i komentara za direktno, korektno umetanje na stranice sajta.

Podržani formati za online konverziju:

  • 97–2004 i noviji DOC u HTML, DOCX u HTML;
  • XLS u HTML, XLSX u HTML;
  • PPT u HTML, PPTX u HTML;
  • TXT u HTML i mnoge druge formate.

Još jedna korisna upotreba usluge, umjesto da trošite sate na pravljenje tabele u HTML-u, napravite je za 15 minuta u Excel-u ili Word-u i pretvorite je u čist, lijep HTML kod za umetanje u web stranicu.

Dobar dan, dragi čitaoci! Nadam se da vam je dobro kao i nama - sunce sija, ptice pevaju, toplo je i leto je došlo! Još radim na disertaciji, tako da poslednjih mesec i po dana pišem samo jednom nedeljno, fizički nemam vremena. Ali da ne pričamo o tužnim stvarima, pređimo na posao!

Jednom davno sam kopao po Internetu da pronađem skriptu koja čisti HTML kod od smeća, što nam, posebno, svima ostavlja „voljenim“ u tom pogledu, Microsoft Word. Ranije sam koristio Čišćenje koda pomoću Adobe Dreamweavera ali je imao dva nedostatka:

    Ponekad ne očisti sve što bismo željeli.

    Ako postoji veoma velika količina koda, skripta za čišćenje ispušta grešku.

Druga tačka mi je postala kritična, jer sam morao da radim sa velikim html tabelama iz kojih se nije bilo moguće odvojiti od jedne stranice, a sve informacije su davale u Wordu.

Tako sam, nakon dugog lutanja internetom, pronašao skriptu koja se odlično nosi sa svim tim upravljanjem, a pritom je potpuno prilagodljiva.

Riješite se prljavih oznaka uz besplatni online HTML Cleaner. Vrlo je lako sastaviti, urediti, formatirati i umanjiti web kod pomoću ovog online alata. Pretvorite Word dokumente u uredan HTML i sve druge vizualne dokumente kao što su Excel, PDF, Google dokumenti itd. Izuzetno je jednostavno i efikasno raditi s dva priložena vizualna i izvorna uređivača koji trenutno reagiraju na vaše radnje.

HTML Cleaner je opremljen mnogim korisnim funkcijama koje olakšavaju čišćenje i uređivanje HTML-a. Samo zalijepite svoj kod u tekstualno područje, postavite postavke čišćenja i pritisnite Čisti HTML dugme. Može rukovati bilo kojim dokumentom kreiranim pomoću Microsoft Excela, PowerPointa, Google dokumenata ili bilo kojeg drugog kompozitora. Pomaže vam da se lako riješite svih inline stilova i nepotrebnih kodova koje dodaju Microsoft Word ili drugi WYSIWYG uređivači. Ovaj alat za uređivanje HTML-a koristan je kada migrirate sadržaj s jedne web stranice na drugu i želite očistiti sve vanzemaljske klase i ID-ove koje izvorna stranica primjenjuje. Koristite alatku za pronalaženje i zamjenu za svoje prilagođene komande. Generator glupog teksta vam omogućava da lako dodate lažni tekst u uređivač.

Na vrhu stranice možete vidjeti vizualni uređivač i uređivač izvornog koda jedan pored drugog. Šta god da izmenite, promene će se odraziti na drugu u realnom vremenu. Vizualni HTML uređivač omogućava početnicima da lako sastave svoj sadržaj kao i kada koriste bilo koji drugi program za obradu teksta, dok na desnoj strani izvorni uređivač sa označenim oznakama koda pomaže naprednim korisnicima da prilagode kod. Ovo čini ovaj online program dobrim alatom za učenje HTML kodiranja.

Pretvorite Word dokumente u čisti HTML

Da biste objavili online PDF-ove, Microsoft Word, Excel, PowerPoint ili bilo koje druge dokumente sastavljene pomoću različitih programa za uređivanje riječi ili samo da biste kopirali sadržaj kopiran s druge web stranice, zalijepite formatirani sadržaj u vizualni uređivač. HTML izvor dokumenta će biti odmah vidljiv iu izvornom uređivaču. Kontrolna traka iznad WYSIWYG editora kontroliše ovo polje, dok su sve ostale postavke čišćenja izvora za uređivanje izvornog koda. Kliknite na Čisti HTML dugme nakon podešavanja postavki čišćenja. Kopirajte očišćeni kod i objavite ga na svojoj web stranici.

Ne postoji garancija da će program ispraviti sve greške u vašem kodu tačno onako kako želite, pa pokušajte da unesete sintaktički važeći HTML.

Pretvorite HTML tabele u strukturirane div elemente aktiviranjem odgovarajućeg polja za potvrdu.

Čišćenje HTML koda iz Microsoft Word oznaka (2000-2007)?

U prošlosti su web dizajneri pravili svoje web stranice koristeći tabele za organizaciju izgleda stranica, ali u eri responzivnog web dizajna tabele su zastarjele i DIV-ovi zauzimaju njihovo mjesto. Ovaj online alat pomaže vam da pretvorite svoje tablice u strukturirane div elemente uz nekoliko jednostavnih klikova.

Svoj izvorni kod možete učiniti čitljivijim organiziranjem hijerarhije kartica u prikazu stabla.

Postati član

Ova web stranica je potpuno funkcionalan alat za čišćenje i sastavljanje HTML koda, ali imate mogućnost da kupite HTML G članstvo i pristupite još profesionalnijim funkcijama. Koristeći besplatnu verziju HTML Cleaner-a pristajete na uključivanje linkova u uređivane dokumente. Ovaj alat za čišćenje može dodati promotivnu vezu treće strane na kraj očišćenih dokumenata i morate ostaviti ovaj kod nepromijenjen sve dok koristite besplatnu verziju.

Cleaner je servis za čišćenje oznaka od “smeća” koje ostaje u dokumentu nakon što sačuvate stranicu u formatu iz programa.

Davno sam napisao sličan plugin, ali je napravljen na brzinu, sada je mehanizam potpuno prepisan.

Čišćenje koda se dešava pretragom unesenog reda iz kojeg se formira novi, koji sadrži „clean“ . Dodatak uklanja apsolutno sve iz oznaka, uključujući . U neuparene oznake, simbol / (kosa crta) je umetnut. Prazne oznake se uklanjaju, na primjer konstrukcija će biti izbrisana jer ne sadrži ništa.

Kako radi html cleaner?

Postoje dva načina:

  1. U MS Wordu odaberite podatke koje želite da obrišete, da biste odabrali sve, pritisnite Ctrl + A. Zalijepite kopirani tekst u polje ispod (mora biti odabrana kartica „Nalijepi MS Office podatke“), kliknite na dugme „Završi“.
  2. Prije optimizacije koda, odaberite “Sačuvaj kao...” u Wordu, zatim odaberite tip datoteke “Web stranica sa filterom”, zatim otvorite sačuvanu datoteku u uređivaču teksta, kopirajte kod i zalijepite ga u polje ispod ( Kartica "Umetni HTML" mora biti odabrana "), kliknite na dugme "Gotovo".

Kao rezultat, dobićete netaknuti html kod.
Sljedeći atributi ostaju netaknuti:

"colspan", "rowspan", "href", "src", "type", "value", "lang", "tabindex", "title", "code", "alt", "target", "dir ", "span", "akcija", "metoda"