📌  相关文章
📜  如何获取页面上的所有脚本 javascript (1)

📅  最后修改于: 2023-12-03 15:09:14.792000             🧑  作者: Mango

如何获取页面上的所有脚本 javascript

在Web应用程序中，可能需要获取页面上所有的JavaScript脚本。这个功能可以用于以下场合：

  • 对于一些需要分析页面中脚本的应用程序，需要获取所有的脚本内容。
  • 对于一些需要修改页面中脚本的应用程序，需要获取脚本内容并进行相应的修改。

下面将介绍几种获取页面上所有脚本的方法。

方法一：使用document.getElementsByTagName()

我们可以使用 document.getElementsByTagName() 方法获取 <script> 标签元素，并遍历它们以获取脚本内容。

// 获取所有 script 标签
const scriptElems = document.getElementsByTagName('script');

// 遍历 HTMLCollection，取出其内容
for (let i = 0; i < scriptElems.length; i++) {
    console.log(scriptElems[i].innerText || scriptElems[i].textContent);
}

方法二：使用document.querySelectorAll()

我们也可以使用 document.querySelectorAll() 方法获取所有的 <script> 标签，并遍历它们以获取脚本内容。

// 获取所有 script 标签
const scriptElems = document.querySelectorAll('script');

// 遍历 NodeList，取出其内容
scriptElems.forEach((elem) => {
    console.log(elem.innerText || elem.textContent);
});

方法三：使用正则表达式

另一种获取页面上所有脚本的方法是使用正则表达式，该方法适用于页面上有动态生成的脚本，如通过 AJAX 加载的内容。

const regex = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;
const scripts = document.documentElement.innerHTML.match(regex);

scripts.forEach((script) => {
    console.log(script);
});

方法四：使用外部库

除了原生 JavaScript 方法外，还有一些外部库可以帮助我们获取页面上所有脚本，如 jQuery：

$('script').each(function() {
    console.log($(this).html());
});

在实际开发中，我们应根据实际需求选择不同的方法来获取页面上的所有脚本。

参考资料：