如何在文本字符串上执行 document.querySelectorAll 而不将其插入 DOM

问题描述 投票：0回答：3
var html = '<p>sup</p>'

我想在该文本上运行 

document.querySelectorAll('p')
，而不将其插入到 dom 中。

在 jQuery 中你可以做 

$(html).find('p')

如果不可能，最干净的方法是什么来进行临时插入，以确保它不会干扰任何东西。然后只查询该元素。然后将其删除。

（我正在执行ajax请求并尝试解析返回的html）

javascript dom
3个回答
61
投票

使用 IE 10 及以上版本，您可以使用 DOM Parser 对象直接从 HTML 解析 DOM。

var parser = new DOMParser();
var doc = parser.parseFromString(html, "text/html");
var paragraphs = doc.querySelectorAll('p');
4
投票

您可以创建临时元素，向其附加 html 并运行 querySelectorAll

var element = document.createElement('div');
element.insertAdjacentHTML('beforeend', '<p>sup</p>');
element.querySelectorAll('p')
0
投票

对于 Node.Js，这是我的可行模式

 const html = (strings, ...values) => String.raw({ raw: strings }, ...values);
 const doc = html`<!doctype html>
   <html lang="en-US">
     <head>
       <title>Hello</title>
     </head>
     <body>
       <div id="1">a</div>
       <div id="2">b</div>
     </body>
   </html>`;

 const jsdom = require("jsdom");   
 const dom = new jsdom.JSDOM(doc);

 const Divs = dom.window.document.querySelectorAll("div");

 for (const one of Divs) {
     console.log(one.outerHTML)
 }

结果是

<div id="1">a</div>
<div id="2">b</div>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.