Uklonite html oznake. Brisanje teksta iz html oznaka. Kako radi html čistač?

Zdravo!

Dok sam pisao vlastiti WYSIWYG uređivač, naišao sam na problem kopiranja teksta iz Worda. Postoje zapravo tri problema:

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

$('#uređivač'). msword_html_filter();
Dodatak je obješen na događaj keyup i provjerava je li izvorni kod unutar uređivača zalijepljen iz Worda; ako je tako, pokreće se funkcija čišćenja. U rezultirajućem html-u zakovano je sve što je moguće - neprekinuti prostori, atributi stil I uskladiti, oznake raspon, Svi Mso-klase, prazni paragrafi.

Pojedinosti o provedbi ispod kroja.

Većina upotrijebljenih regularnih programa preuzeta je s TinyMCE-a.

Kako utvrditi sadrži li redak html kod umetnut iz Worda:

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

Funkcija čišćenja koda (proslijeđeno u funkciju jquery objekt urednik):

Funkcija word_filter(editor)( var content = editor.html(); // Wordovi komentari poput uvjetnih komentara itd. content = content.replace(/<(!|script[^>]*>.*?<\/script(?=[>\s])|\/?(\?xml(:\w+)?|img|meta|link|style|\w:\w+)(?=[\s\/>]))[^>]* >>gi, ""); // Pretvoriti u <(\/?)s>/gi,"<$1strike> ___ ([\s\u00a0]*)<\/span>/gi, function(str, spaces) ( return (spaces.length > "; if (/^\s*\w+\./.test(txt)) ( var matches = /()\./.exec(txt ); if (odgovara) ( var start = parseInt(matches, 10); list_tag = start>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("klasa"); $("p:prazno", editor).remove(); )

Potpuni izvorni tekst dodatka nalazi se ispod spojlera, spremite ga u datoteku jquery.msword_html_filter.js

izvorni tekst dodatka

(function($) ( $.fn.msword_html_filter = function(options) ( var settings = $.extend((), options); function word_filter(editor)( var content = editor.html(); // Word komentari poput uvjetni 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 u za line-though content = content.replace(/<(\/?)s>/gi,"<$1strike>"); // Zamijenite nbsp entitete u char jer je lakše rukovati //content = content.replace(/ /gi, "\u00a0"); sadržaj = sadržaj.zamijeni(/ /gi, " "); // Pretvoriti ___ na niz izmjeničnih // raskidnih/neraskidivih razmaka iste duljine content = content.replace(/ ([\s\u00a0]*)<\/span>/gi, funkcija(str, razmaci) ( return (razmaci.duljina > 0) ? razmaci.replace(/./, " ").slice(Math.floor(razmaci.length/2)).split("") .join("\u00a0") : ""; )); editor.html(sadržaj); // Raščlanite razinu uvlake popisa za popise $("p", editor).each(function())( var str = $(this).attr("style"); var matches = /mso-list:\w+ \ w+(+)/.exec(str); if (odgovara) ( $(ovo).data("_listLevel", parseInt(odgovara, 10)); ) )); // Raščlanjivanje popisa 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 matches = /()\./.exec(txt); if (matches) ( var start = parseInt ( odgovara, 10); list_tag = start>1 ? "" : ""; )else( list_tag = ""; ) ) if(cur_level>last_level)( if(last_level==0)( $(this).before( lista_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 idealan je alat za uređivanje izvornog koda WordPress članaka ili bilo kojeg drugog sustava za upravljanje sadržajem kada njihov ugrađeni sastavljač ne pruža sve funkcije koje su nam potrebne. Sastavite sadržaj izravno u prozoru preglednika bez instaliranja proširenja ili dodatka za rukovanje označavanjem sintakse i drugim značajkama za uređivanje teksta.

Kako koristiti?

Zalijepite dokument koji želite pretvoriti u uređivač Worda, a zatim idite na HTML preglednik pomoću velikih kartica na vrhu stranice za generiranje koda.

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

Problemi s pretvorbom koje lako rješava naš online HTML pretvarač

Problem pretvaranja worda u html vjerojatno je oduvijek postojao uz Microsoft Word. Ogroman broj stilova dodijeljenih tekstovima, kao što je mso-spacerun:yes, i klasa, kao što je MsoNormal, kao i gomila svih vrsta span style="font-size:10.0pt" uvelike zatrpavaju kod. I često prekidaju izvorne stilove navedene na web mjestu. Ako još uvijek možete rukovati jednostavnim tekstom umetanjem teksta putem uređivačkog gumba "Umetni samo tekst", tada ova metoda neće raditi s tablicama. Naš pretvarač je u mogućnosti jednostavno očistiti sve nepotrebne komentare i stilove iz buduće html datoteke, jednostavnim klikom na gumbe.


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 kôd od suvišnih razmaka i dvostrukih oznaka
  • Ako je potrebno, potpuno uklonite HTML oznake.

Pretvorite Word, Excel, TxT datoteke u čisti HTML izvorni kod. Bez nepotrebnih stilova i komentara za izravno, ispravno umetanje na stranice web mjesta.

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 izradu tablice u HTML-u, napravite je za 15 minuta u Excelu ili Wordu i pretvorite je u čist, prekrasan HTML kod za umetanje na web mjesto.

Dobar dan, dragi čitatelji! Nadam se da je i vama dobro kao i nama - sunce sija, ptice pjevaju, toplo je i ljeto je stiglo! Još uvijek radim na diplomskom radu, tako da zadnjih mjesec i pol pišem samo jednom tjedno, fizički nemam vremena. Ali nemojmo o tužnim stvarima, prijeđimo na posao!

Jednom davno sam kopao po internetu ne bi li pronašao skriptu koja čisti HTML kod od smeća, što posebno ostavlja svima nama “voljeni” po tom pitanju Microsoft Word. Prethodno sam koristio Čišćenje koda pomoću programa Adobe Dreamweaver ali je imao dva nedostatka:

    Ponekad ne čisti sve što bismo htjeli.

    Ako postoji jako velika količina koda, skripta za čišćenje izbacuje pogrešku.

Druga točka postala je kritična za mene, jer sam morao raditi s velikim html tablicama, od kojih je bilo nemoguće odmaknuti se od jedne stranice, a sve su informacije pružali u Wordu.

Tako sam, nakon dugog lutanja internetom, pronašao skriptu koja se sa svim tim upravljanjem nosi s praskom, a istovremeno je potpuno prilagodljiva.

Riješite se svoje prljave oznake pomoću besplatnog mrežnog HTML Cleanera. Vrlo je jednostavno sastaviti, urediti, formatirati i minimizirati web kod pomoću ovog mrežnog alata. Pretvorite Word dokumente u uredan HTML i sve druge vizualne dokumente kao što su Excel, PDF, Google Docs itd. Izuzetno je jednostavno i učinkovito raditi s dva priložena vizualnog i izvornog uređivača koji trenutačno reagira na vaše radnje.

HTML Cleaner opremljen je mnogim korisnim značajkama koje čišćenje i uređivanje HTML-a čine što lakšim. Samo zalijepite svoj kod u tekstualno područje, postavite postavke čišćenja i pritisnite Čisti HTML dugme. Može obraditi bilo koji dokument stvoren pomoću programa Microsoft Excel, PowerPoint, Google docs ili bilo kojeg drugog skladatelja. Pomaže vam da se jednostavno riješite svih ugrađenih stilova i nepotrebnih kodova koje je dodao 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 strane klase i ID-ove koje primjenjuje izvorna stranica. Koristite alat za traženje i zamjenu za svoje prilagođene naredbe. Generator besmislenog teksta omogućuje vam jednostavno dodavanje lažnog teksta u uređivač.

Na vrhu stranice možete vidjeti vizualni uređivač i uređivač izvornog koda jedan pored drugog. Što god promijenite, promjene će se odraziti na druge u stvarnom vremenu. Vizualni HTML uređivač omogućuje početnicima da jednostavno sastavljaju svoj sadržaj kao i kod bilo kojeg drugog programa za obradu teksta, dok s desne strane uređivač izvora s istaknutim oznakama koda pomaže naprednim korisnicima da prilagode kod. To čini ovaj mrežni program zgodnim alatom za učenje HTML kodiranja.

Pretvorite Word dokumente u čisti HTML

Za objavljivanje online PDF-ova, Microsoft Worda, Excela, PowerPointa ili bilo kojih drugih dokumenata sastavljenih s različitim programima za uređivanje riječi ili samo za kopiranje sadržaja kopiranog s druge web stranice, zalijepite formatirani sadržaj u vizualni uređivač. HTML izvor dokumenta također će biti odmah vidljiv u uređivaču izvora. Kontrolna traka iznad WYSIWYG uređivača kontrolira ovo polje dok su sve ostale postavke čišćenja izvora za uređivanje izvornog koda. Kliknite na Čisti HTML nakon postavljanja postavki čišćenja. Kopirajte očišćeni kod i objavite ga na svojoj web stranici.

Ne postoji jamstvo da će program ispraviti sve pogreške u vašem kodu točno onako kako vi želite, stoga pokušajte unijeti sintaktički valjani HTML.

Pretvorite HTML tablice u strukturirane div elemente aktiviranjem odgovarajućeg potvrdnog okvira.

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

U prošlosti su web dizajneri gradili svoje web stranice koristeći tablice za organiziranje izgleda stranice, ali u eri responzivnog web dizajna tablice su zastarjele i DIV-ovi zauzimaju njihovo mjesto. Ovaj mrežni alat pomaže vam pretvoriti svoje tablice u strukturirane div elemente s nekoliko jednostavnih klikova.

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

Postati član

Ova je web stranica potpuno funkcionalan alat za čišćenje i sastavljanje HTML koda, ali imate mogućnost kupiti HTML G članstvo i pristupiti još profesionalnijim značajkama. Korištenjem besplatne verzije HTML Cleanera pristajete na uključivanje poveznica u uređene 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 spremanja stranice u formatu iz programa.

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

Čišćenje koda događa se pretraživanjem unesenog retka iz kojeg se formira novi koji sadrži “clean” . Dodatak uklanja apsolutno sve iz oznaka, uključujući . U neuparenim oznakama umetnut je simbol / (kosa crta). Prazne oznake se uklanjaju, na primjer, konstrukcija će biti izbrisana jer ne sadrži ništa.

Kako radi html čistač?

Postoje dva načina:

  1. U MS Wordu odaberite podatke koje želite izbrisati, za odabir svih pritisnite Ctrl + A. Zalijepite kopirani tekst u polje ispod (mora biti odabrana kartica “Zalijepi MS Office podatke”), kliknite gumb “Završi”.
  2. Prije optimiziranja koda odaberite “Spremi kao...” u Wordu, zatim odaberite vrstu datoteke “Web stranica s filtrom”, zatim otvorite spremljenu datoteku u uređivaču teksta, kopirajte kod i zalijepite ga u polje ispod ( Mora biti odabrana kartica "Umetni HTML"), kliknite gumb "Gotovo".

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

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