堆栈内存溢出
  繁体   English   中英

如何使用jsdom序列化没有head和body标签的HTML

[英]How to serialize HTML without head and body tags using jsdom

 原文  2022-05-30 09:43:34  4   1    javascript/ html/ jsdom

问题描述

我想从 html 文档中清除一些标签，如下所示：

const { JSDOM } = require('jsdom');

function clearAnchorTags(pDom: JSDOM) {
    if (typeof pDom === 'string') {
        pDom = new JSDOM(pDom);
    }

// Get all anchor tags from dom
for (const anchorTag of pDom.window.document.querySelectorAll('a')) {
    for (const child of anchorTag.children) {
        if (child.nodeName === 'EM') {
            const node = pDom.window.document.createTextNode(child.textContent);
            anchorTag.replaceChild(node, child);
        }
        if (child.nodeName === 'B') {
            const node = pDom.window.document.createTextNode(child.textContent);
            anchorTag.replaceChild(node, child);
        }
        if (child.nodeName === 'U') {
            const node = pDom.window.document.createTextNode(child.textContent);
            anchorTag.replaceChild(node, child);
        }
    }
}

// return as string just as we received it -- also replace   with space
return pDom.serialize().replace(/ /g, ' ');
}

问题似乎是最后的 serialize() 方法，因为它返回一个功能齐全的 HTML 文档。

我需要它没有<html>, <head> and <body>标签。 我只需要一个 HTML 片段。

1 个解决方案

解决方案1
 0  2022-05-30 10:04:43

我解决了我的问题

return pDom.window.document.body.innerHTML.replace(/&nbsp;/g, ' ');

html如何破解成<div>使用 jsdom 的部分</div><div id="text_translate"><p>我已经自动生成了 HTML 这样的结构：</p><pre> <.DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> <h2>Subheading A</h2> <p>Subheading content 1</p> <ul> <li>bla</li> </ul> <p>Subheading content 2</p> <h2>Subheading B</h2> <p>Subheading content 1</p> <p>Subheading content 2</p> <p>Subheading content 3</p> </body> </html></pre><ul><li> Html 可以有任意数量的副标题 (h2)。</li><li> 子标题之间可以有任意数量的 HTML 个元素。</li><li> 我想将每个副标题和后续标签包装到一个<div>中</li></ul><p>这是一个例子</p><pre> <.DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> <div> <h2>Subheading A</h2> <p>Subheading content 1</p> <ul> <li>bla</li> </ul> <p>Subheading content 2</p> </div> <div> <h2>Subheading B</h2> <p>Subheading content 1</p> <p>Subheading content 2</p> <p>Subheading content 3</p> </div> </body> </html></pre><p> 那是我想出的一些代码</p><pre>const dom = new JSDOM(myHtmlString); orig_html = dom.window.document.getElementById("h2").innerHTML; new_html = "<div>" + org_html + "</div>"; dom.window.document.getElementById("h2").innerHTML = new_html;</pre><p> 但是，我需要找到属于当前 h2 的所有元素，并将 HTML 分成几个部分来这样做。 您知道实现该目标的最佳方法是什么吗？</p><p> 更新：</p><p> 您怎么看，在那种情况下使用jsdom可能不是一个好主意？ 仅使用文本操作来实现该结果会更好吗？</p></div>

[英]How to break html into <div> sections using jsdom

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何使用JavaScript使用HTML从字符串中删除整个HTML，HEAD标签和BODY标签？ 如何从 html 字符串中获取 head 和 body 标签作为字符串？ 是<script> tags outside <head> and <body> permitted in HTML? 如何在Yii2所见即所得编辑器中启用完整的html支持（html，head，body，meta标签等…）？ 如何在里面添加某些脚本标签<head>和<body>使用 HtmlWebackPlugin 时的标签 在流星中使用Spiderable会在正文标记中显示html之前复制头部内容 html如何破解成<div>使用 jsdom 的部分</div><div id="text_translate"><p>我已经自动生成了 HTML 这样的结构：</p><pre> <.DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> <h2>Subheading A</h2> <p>Subheading content 1</p> <ul> <li>bla</li> </ul> <p>Subheading content 2</p> <h2>Subheading B</h2> <p>Subheading content 1</p> <p>Subheading content 2</p> <p>Subheading content 3</p> </body> </html></pre><ul><li> Html 可以有任意数量的副标题 (h2)。</li><li> 子标题之间可以有任意数量的 HTML 个元素。</li><li> 我想将每个副标题和后续标签包装到一个<div>中</li></ul><p>这是一个例子</p><pre> <.DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> <div> <h2>Subheading A</h2> <p>Subheading content 1</p> <ul> <li>bla</li> </ul> <p>Subheading content 2</p> </div> <div> <h2>Subheading B</h2> <p>Subheading content 1</p> <p>Subheading content 2</p> <p>Subheading content 3</p> </div> </body> </html></pre><p> 那是我想出的一些代码</p><pre>const dom = new JSDOM(myHtmlString); orig_html = dom.window.document.getElementById("h2").innerHTML; new_html = "<div>" + org_html + "</div>"; dom.window.document.getElementById("h2").innerHTML = new_html;</pre><p> 但是，我需要找到属于当前 h2 的所有元素，并将 HTML 分成几个部分来这样做。 您知道实现该目标的最佳方法是什么吗？</p><p> 更新：</p><p> 您怎么看，在那种情况下使用jsdom可能不是一个好主意？ 仅使用文本操作来实现该结果会更好吗？</p></div> 在什么情况下，可以将HTML标记中的脚本标签包含在head标签中而不使用async和defer属性？ 脚本标签在HTML文档中的位置- <head> 和 <body> 有不同的行为 使用 jQuery 读取 div 内容跳过 HTML、head 和 body 标签
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM