我可以在浏览器上删除 HTML 代码片段吗-解网

问：

我有一个 HTML 代码块。如何使用纯JS或JQuery在浏览器上删除此代码片段？

这是我的代码：

<ul>
    <li>New York</li>
    <li>London</li>
    <li>Madrid</li>
    <li>Paris</li>
</ul>

我期望的结果是：

<p>New York, London, Madrid, Paris</p>

我不需要获取网站的 HTML 文档。我已经有很多块了。我只想在客户端报废这些块。

JavaScript HTML jQuery 网页抓取客户端

如果我理解正确的话，你已经有一个包含 HTML 的字符串，所以你唯一需要做的就是解析该字符串。这可以使用类来完成。从那时起，它就很简单了，因为你会得到一个返回，它提供了你现在应该从网页的 DOM 中已经找到的所有方法。在这种情况下，您可以使用获取所有列表项，然后仅用于获取这些列表项。stringDOMParserDocumentgetElementsByTagName()map()textContent

const domParser = new DOMParser();
const parsed = domParser.parseFromString(`
<ul>
  <li>New York</li>
  <li>London</li>
  <li>Madrid</li>
  <li>Paris</li>
</ul>`, "text/html");

const cityArray = [...parsed.getElementsByTagName("li")]
                    .map(li => li.textContent);
console.log(cityArray);

编辑

现在我正在阅读您编辑的问题，我认为您想做的事情与网络抓取无关，您只想在您拥有的网站上编辑您现有的 DOM。

在这种情况下，您可以跳过整个解析，而是执行以下操作：

const cityArray = [...document.getElementsByTagName("li")]
  .map(li => li.textContent);
const pTag = document.createElement("p");
pTag.textContent = cityArray.join(", ");
document.body.appendChild(pTag);

<ul>
  <li>New York</li>
  <li>London</li>
  <li>Madrid</li>
  <li>Paris</li>
</ul>

实际上，你会在网上抓取一些数据，并将其放在一个文件或数据库中（只存储相关数据，而不是HTML文档！），然后每当客户端请求此信息时，服务器就会读取该文件或查询该数据库。对于单页应用程序，您将向服务器上的某个端点发送 HTTP 请求，然后根据需要在客户端呈现数据。或者，如果你有一个经典的 Web 应用程序，服务器只会返回它生成的一些包含数据的 HTML（例如，使用模板引擎）。每当客户需要数据时，网络抓取效率不是很高。

0赞 JohnnyBravo 12/7/2022

再次感谢。我正在制作实时比分应用程序。我每分钟都会从网站获取信息。这就是我的想法，因为我有一个小型服务器。但你说的很有道理。

0赞 Mushroomator 12/7/2022

在这种情况下，请考虑使用 WebSockets，这将允许您非常有效地将数据从服务器推送到客户端。

上一个：如何在 Web 上使用 pyscript 获取周围设备的蓝牙数据（客户端 - 端）

下一个：如何访问本地目录，将其压缩并发布到端点仅使用客户端的 Javascript

我可以在浏览器上删除 HTML 代码片段吗

Can I scrapping an HTML code snippet on browser

评论

编辑

评论