Nodejs中怎样获取script标签中的内容?

Node.js 中怎样获取 `<script>` 标签中的内容？

问题描述

假设你有一个 HTML 文件，其中包含一个 <script> 标签，如：

<script type="text/jade" id="tmpl" src="tmpl.jade">
  // 这里是 Jade 模板内容
</script>

你想在 Node.js 中读取这个 <script> 标签内的内容。例如，你可能需要将 Jade 模板内容提取出来进行进一步处理。

解决方案

要实现这一点，你需要先加载这个 HTML 文件，然后使用一些库来解析 DOM 并提取 <script> 标签的内容。这里我们使用 cheerio 来模拟浏览器环境并解析 HTML。

安装依赖

首先，确保你已经安装了 cheerio 和 fs（文件系统模块）：

npm install cheerio

读取和解析 HTML 文件

接下来，你可以编写一段 Node.js 脚本来读取 HTML 文件，并使用 cheerio 解析它以获取 <script> 标签的内容。

const fs = require('fs');
const cheerio = require('cheerio');

// 读取 HTML 文件
fs.readFile('path/to/your/file.html', 'utf8', (err, data) => {
  if (err) {
    console.error("Error reading file:", err);
    return;
  }

  // 使用 cheerio 加载 HTML
  const $ = cheerio.load(data);

  // 选择具有特定 ID 的 script 标签
  const scriptContent = $('#tmpl').text();

  // 输出 script 标签的内容
  console.log(scriptContent);
});

在这个例子中，我们做了以下几步：

使用 fs.readFile 读取 HTML 文件。
使用 cheerio.load 加载 HTML 数据。
使用 jQuery 风格的选择器 $('#tmpl') 选择具有 id="tmpl" 的 <script> 标签。
调用 .text() 方法获取该标签内的文本内容。

注意事项

确保 <script> 标签内的内容是有效的文本，即没有被其他标签包裹。
如果 <script> 标签有 src 属性，内容将来自外部文件，而不是直接嵌入在标签内。在这种情况下，你需要另外处理外部文件的加载。

通过这种方式，你可以轻松地从 HTML 文件中提取出 <script> 标签内的内容，并在 Node.js 中进行处理。

itying888 2楼

$('script[type="text/jade"]').each(function () {
  var script = $(this).html();
  // script就是js代码了
});

vueper 3楼

这样还是不安全的说.

$('script[type="text/jade"]').each(function(){console.log(this.text)});

bupafengyu 4楼

笨一点的方法：你获取到script标签的src属性，然后自己发出个ajax请求去获取内容

sinazl 5楼

是不是没放在document的ready以后执行？

sinazl 6楼

浏览器应该是执行src所引入的脚本文件~ 如果想获取那个src的文件，个人觉得老雷的说法还可以尝试去做！

zlyuanteng 7楼

内联的可以$(id).html()，对于外部资源，浏览器是首先加载到script然后解释执行的，你这里用src一般做法就是一个xhr请求取回来内容

htzhanglong 8楼作者

同样遇到这个问题，前后端同时使用jade 是不能把模板放到内嵌script里的，然后很别扭，我的方法是把jade文件转化成字符串，然后付给一个变量，前端代码中直接引用这个变量不过这个又失去了jade易读易写的结构，也没找到什么好方法

phonegap100 9楼

如果jade能够生成内嵌的script 不去除空格而且复合jade格式的话，这个问题也算解决了

gougou168 10楼

不对我的问题解决了可以用内嵌注意里面的变量#{XX} 前要加\ 看来是我想过来

itying888 11楼

不过使用iframe是可以的，而且直接把jade的文本放在iframe的pre标签里，不过获取iframe的内部标签怎么获取，不要笑，我真不知道，前端的这些东西我都没有系统的学过。网上好像有些方法，不过自己稍微试了一下，好像有问题，不过这种问题应该很容易解决。也许获取iframe的内部标签对你们而言是小儿科，而且这种方法太难看了，（那么一大堆源代码直接作为字符串放在iframe里啊，）所以还是想找个更好的方法。

bupafengyu 12楼

在Node.js环境中，<script>标签中的内容主要用于浏览器端的JavaScript执行。如果你是在浏览器环境中使用jQuery或纯JavaScript来获取<script>标签中的内容，可以使用以下方法。但根据你的问题描述，你似乎更关注在服务器端（Node.js）如何处理这种场景。

在浏览器环境中

使用纯JavaScript

你可以通过DOM API来获取<script>标签中的内容：

<script type="text/jade" id="tmpl">
  // jade template content
</script>

<script>
  const scriptContent = document.getElementById('tmpl').textContent;
  console.log(scriptContent);
</script>

使用jQuery

如果你更喜欢使用jQuery，可以这样做：

<script type="text/jade" id="tmpl">
  // jade template content
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  const scriptContent = $('#tmpl').text();
  console.log(scriptContent);
</script>

在Node.js环境中

如果需要在服务器端解析包含模板内容的<script>标签，你需要先将HTML文件读取到内存中，然后使用DOM解析库如jsdom来模拟浏览器环境并提取内容。

首先，安装jsdom:

npm install jsdom

然后，可以这样实现：

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

// 假设这是你的HTML字符串
const html = `
<!DOCTYPE html>
<html>
<body>
  <script type="text/jade" id="tmpl">
    // jade template content
  </script>
</body>
</html>
`;

const dom = new JSDOM(html);
const scriptContent = dom.window.document.querySelector('#tmpl').textContent;

console.log(scriptContent); // 输出 jade 模板内容

这段代码首先创建了一个JSDOM实例来模拟一个完整的浏览器环境，然后使用DOM查询方法获取特定ID的<script>标签内容。这种方法适用于需要在服务器端解析HTML文档并在其中查找特定元素的情况。

Nodejs中怎样获取script标签中的内容?