Programa para remover tags html. Limpeza de código HTML ao inserir texto do MS Word no editor HTML5 WYSIWYG (conteúdo editável)

18.10.2023

Bom dia, queridos leitores! Espero que você esteja tão bem quanto nós - o sol está brilhando, os pássaros cantando, está quente e o verão chegou! Atualmente estou trabalhando na minha dissertação, então há um mês e meio escrevo apenas uma vez por semana, fisicamente não tenho tempo. Mas não vamos falar de coisas tristes, vamos ao que interessa!

Era uma vez, eu estava vasculhando a Internet em busca de um script que limpasse o lixo do código HTML, o que, principalmente, nos deixa com um “queridinho” nesse quesito Microsoft Word. Anteriormente eu usava Limpeza de código usando Adobe Dreamweaver mas ele tinha duas desvantagens:

    Às vezes não limpa tudo o que gostaríamos.

    Muito grandes quantidades O script de limpeza apresenta um erro.

O segundo ponto tornou-se crítico para mim, pois tive que trabalhar com grandes tabelas HTML, do qual era impossível sair de um site, e forneceram todas as informações em Word.

Assim, depois de muito tempo vagando pela Internet, encontrei um script que dá conta de todo esse gerenciamento com força e ao mesmo tempo é totalmente customizável.

Olá!

Ao escrever meu próprio editor WYSIWYG, encontrei um problema ao copiar texto do Word. Na verdade, existem três problemas:

  • Word insere muito lixo código HTML que precisa ser limpo
  • Por alguma razão, o Word usa parágrafos em vez de tags UL e LI para apresentar listas
  • Na verdade, como determinar se o texto inserido foi inserido do Word.
Em geral, para resolver esses problemas, foi escrito um plugin jquery, completo código fonte que está disponível no final do artigo. Exemplo de uso:

$('#editor'). msword_html_filter();
O plugin está pendurado em um evento teclar e verifica se o código-fonte dentro do editor foi colado do Word; em caso afirmativo, a função de limpeza é iniciada; Tudo o que é possível está incluído no html resultante - espaços ininterruptos, atributos estilo E alinhar, etiquetas período, Todos Mso-classes, parágrafos vazios.

Detalhes de implementação sob o corte.

A maioria dos regulares usados ​​foram retirados do TinyMCE.

Como determinar se uma linha contém código HTML inserido no Word:

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

Função de limpeza de código (um objeto do editor jquery é passado para a função):

Função word_filter(editor)( var content = editor.html(); // Comentários do Word como comentários condicionais etc content = content.replace(/<(!|script[^>]*>.*?<\/script(?=[>\s])|\/?(\?xml(:\w+)?|img|meta|link|style|\w:\w+)(?=[\s\/>]))[^>]* >>gi, ""); //Converter <(\/?)s>em<$1strike> ___ /gi,"<\/span>([\s\u00a0]*) /gi, function(str, espaços) ( return (spaces.length > "; if (/^\s*\w+\./.test(txt)) ( var matches = /()\./.exec(txt) ); if (correspondências) ( var start = parseInt(correspondências, 10); list_tag = start>1 ? "" : ""; )else( list_tag = ""; ) ) if(cur_level>" + $(este).html() + "

") $(this).remove(); last_level = cur_level; )else( last_level = 0; ) )) $("", editor).removeAttr("style"); $("", editor).removeAttr( "alinhar"); $("span", editor).replaceWith(function() (return $(this).contents();)); , editor).removeAttr("class"); $("p:empty", editor).remove(); O texto fonte completo do plugin está sob o spoiler, salve em um arquivo

jquery.msword_html_filter.js

texto fonte do plugin(function($) ( $.fn.msword_html_filter = function(options) ( var settings = $.extend((), options); function word_filter(editor)( var content = editor.html(); // Comentários do Word como comentários condicionais etc content = content.replace(/<(!|script[^>]*>.*?<\/script(?=[>\s])|\/?(\?xml(:\w+)?|img|meta|link|style|\w:\w+)(?=[\s\/>]))[^>]* >>gi, ""); //Converter /gi, "");<(\/?)s>em<$1strike>// Remove comentários, scripts (por exemplo, msoShowComment), tag XML, conteúdo VML, // tags com namespace do MS Office e algumas outras tags content = content.replace(/ ___ para linha-embora content = content.replace(/ /gi,"<\/span>"); // Substitua entidades nbsp por char, pois é mais fácil de manusear //content = content.replace(/ /gi, "\u00a0"); /gi, function(str, espaços) ( return (spaces.length > "; if (/^\s*\w+\./.test(txt)) ( var matches = /()\./.exec(txt) ); if (correspondências) ( var start = parseInt(correspondências, 10); list_tag = start>1 ? "" : ""; )else( list_tag = ""; ) ) if(cur_level>") $(this).remove(); last_level = cur_level; )else( last_level = 0; ) )) $("", editor).removeAttr("style"); $("", editor).removeAttr( "alinhar"); $("span", editor).replaceWith(function() (return $(this).contents();)); , editor).removeAttr("class"); $("p:empty", editor).remove(); return this.each(function() ( $(this).on("keyup", function ()( var conteúdo = $(this).html(); if (/class="?Mso|style="[^"]*\bmso-|style="[^""]*\bmso-|w :WordDocument/ i.teste(conteúdo)) ( word_filter($(this)); ) ));


O desempenho foi testado apenas no Firefox mais recente.

Livre-se de sua marcação suja com o HTML Cleaner online gratuito. É muito fácil compor, editar, formatar e reduzir o código web com esta ferramenta online. Converta documentos do Word em HTML organizado e quaisquer outros documentos visuais como Excel, PDF, Google Docs etc. É extremamente simples e eficiente trabalhar com os dois editores visuais e de código-fonte anexados, que respondem instantaneamente às suas ações.

HTML Cleaner está equipado com muitos recursos úteis para tornar a limpeza e edição de HTML o mais fácil possível. Basta colar seu código na área de texto, configurar as preferências de limpeza e pressionar o botão Limpar HTML botão. Ele pode lidar com qualquer documento criado com Microsoft Excel, PowerPoint, Google Docs ou qualquer outro compositor. Ele ajuda você a se livrar facilmente de todos os estilos embutidos e códigos desnecessários adicionados pelo Microsoft Word ou outros editores WYSIWYG. Esta ferramenta de edição de HTML é útil quando você está migrando o conteúdo de um site para outro e deseja limpar todas as classes e IDs estranhos que o site de origem aplica. Use a ferramenta localizar e substituir para seus comandos personalizados. O gerador de texto sem sentido permite adicionar facilmente texto fictício ao editor.

No topo da página você pode ver o editor visual e o editor de código-fonte lado a lado. Qualquer que você modifique, as alterações serão refletidas no outro em tempo real. O editor visual de HTML permite que iniciantes componham facilmente seu conteúdo, como fariam com qualquer outro programa de processador de texto, enquanto à direita o editor de código-fonte com marcação de código destacada ajuda os usuários avançados a ajustar o código. Isso torna este programa online uma ótima ferramenta para aprender a codificação HTML.

Converta documentos do Word para limpar HTML

Para publicar PDFs online, Microsoft Word, Excel, PowerPoint ou quaisquer outros documentos compostos com diferentes programas editores de texto ou apenas para copiar o conteúdo copiado de outro site, cole o conteúdo formatado no editor visual. O código-fonte HTML do documento também ficará imediatamente visível no editor de código-fonte. A barra de controle acima do editor WYSIWYG controla este campo enquanto todas as outras configurações de limpeza de origem são para edição do código-fonte. Clique no Limpar HTML botão após configurar as preferências de limpeza. Copie o código limpo e publique-o em seu site.

Não há garantia de que o programa corrija todos os erros no seu código exatamente da maneira que você deseja, então tente inserir um HTML sintaticamente válido.

Converta as tabelas HTML em elementos div estruturados ativando a caixa de seleção correspondente.

Limpando o código HTML das tags do Microsoft Word (2000-2007)?

No passado, os web designers costumavam construir seus sites usando tabelas para organizar o layout da página, mas na era do web design responsivo, as tabelas estão desatualizadas e os DIVs estão tomando seu lugar. Esta ferramenta online ajuda você a virar o jogo para elementos div estruturados com apenas alguns cliques.

Você pode tornar seu código-fonte mais legível organizando a hierarquia de guias em uma exibição em árvore.

Torne-se um membro

Este site é uma ferramenta totalmente funcional para limpar e compor código HTML, mas você tem a possibilidade de adquirir uma assinatura HTML G e acessar recursos ainda mais profissionais. Usando a versão gratuita do HTML Cleaner você concorda em incluir links nos documentos editados. Esta ferramenta de limpeza pode adicionar um link promocional de terceiros ao final dos documentos limpos e você precisa deixar este código inalterado desde que use a versão gratuita.

Cleaner é um serviço de limpeza de tags do “lixo” que permanece no documento após salvar a página no formato do programa.

Há muito tempo escrevi um plugin semelhante, mas foi feito às pressas, agora o mecanismo foi totalmente reescrito.

A limpeza do código ocorre pesquisando na linha inserida a partir da qual uma nova é formada, contendo um “clean” . O plugin remove absolutamente tudo das tags, incluindo . Nas tags não pareadas é inserido o símbolo / (barra). Tags vazias são removidas, por exemplo, a construção será excluída porque não contém nada.

Como funciona o limpador de HTML?

Existem duas maneiras:

  1. No MS Word, selecione os dados que deseja limpar, para selecionar todos pressione Ctrl + A. Cole o texto copiado no campo abaixo (a aba “Colar dados do MS Office” deve estar selecionada), clique no botão “Concluir”.
  2. Antes de otimizar o código, selecione “Salvar como...” no Word, em seguida selecione o tipo de arquivo “Página Web com filtro”, em seguida abra o arquivo salvo em um editor de texto, copie o código e cole no campo abaixo (o A guia “Inserir HTML” deve estar selecionada "), clique no botão "Concluído".

Como resultado, você receberá um código HTML puro.
Os seguintes atributos permanecem intactos:

"colspan", "rowspan", "href", "src", "type", "value", "lang", "tabindex", "title", "code", "alt", "target", "dir ", "span", "ação", "método"

Excel/Word to HTML é uma ferramenta ideal para editar o código-fonte de artigos WordPress ou qualquer outro sistema de gerenciamento de conteúdo quando seu compositor integrado não fornece todas as funções que precisamos. Componha conteúdo diretamente na janela do navegador sem instalar uma extensão ou plug-in para lidar com realce de sintaxe e outros recursos de edição de texto.

Como usar?

Cole o documento que deseja converter no editor Word e vá para o visualizador HTML usando as abas grandes na parte superior da página para gerar o código.

Limpe a marcação suja com um botão grande que executa opções ativas (marcadas) em uma lista. Você também pode aplicar essas funções uma por uma usando o ícone CLEAN.

Problemas de conversão que são facilmente resolvidos pelo nosso conversor HTML online

O problema de converter Word em HTML provavelmente sempre existiu junto com o Microsoft Word. Um grande número de estilos atribuídos a textos, como mso-spacerun:yes, e classes, como MsoNormal, bem como uma confusão de todos os tipos de span style="font-size:10.0pt" desorganizam bastante o código. E muitas vezes interrompem os estilos nativos especificados no site. Se você ainda consegue lidar com texto simples inserindo texto por meio do botão "Inserir somente texto" do editor, esse método não funcionará com tabelas. Nosso conversor é capaz de limpar facilmente quaisquer comentários e estilos desnecessários do futuro arquivo html, simplesmente clicando nos botões.


Limpeza online de HTML de estilos CSS desnecessários
  • Remova quaisquer estilos desnecessários de todo o texto ou de um fragmento selecionado
  • Removemos códigos de indentação, símbolos e outros códigos Unicode desnecessários
  • Limpe o código de espaços extras e tags duplicadas
  • Se necessário, remova completamente a marcação HTML.

Converta arquivos Word, Excel, TxT em código-fonte HTML limpo. Sem estilos e comentários desnecessários para inserção direta e correta nas páginas do site.

Formatos suportados para conversão online:

  • 97–2004 e DOC mais recente para HTML, DOCX para HTML;
  • XLS para HTML, XLSX para HTML;
  • PPT para HTML, PPTX para HTML;
  • TXT para HTML e muitos outros formatos.

Outro uso útil do serviço, em vez de gastar horas fazendo uma tabela em HTML, faça-a em 15 minutos no Excel ou Word e converta-a em um código HTML limpo e bonito para inserir no site.