如何在字符串中通过data属性获取元素并在node.js应用程序中获取内部文本？

Question

我是node的新手，希望我的问题不会太丑。 谢谢。

有一个节点应用程序，它的一部分导致了html站点流。

.pipe(tap(function(file) {
    var content = file.contents.toString(),
        relPathPrefix = path.join(path.relative(file.path, './source'));

    relPathPrefix = relPathPrefix
        .replace(new RegExp('\\' + path.sep, 'g'), '/') // Normalize path separator
        .replace(/\.\.$/, ''); // Remove trailing ..

    content = content.replace(/('|")\//g, '$1' + relPathPrefix);
    //console.log(content)

    //here is where i`am struggling 

    file.contents = Buffer.from(content);
}))

变量“内容”保存完整的网站数据。 现在，我必须解析变量“ content”，我将找到值为“ meta.code.data”的数据属性“ data-type”，然后获取textContent。 至少，我将从“ ... innerText ...”之类的值中剥离出文本本身。

我知道如何使用jQuery在浏览器中执行此操作：

var json = $('pre[data-type="meta.code.data"]').text()

以及香草JavaScript

var json = document.querySelectorAll('[data-type="meta.code.data"]')[0].textContent;

但实际上我找不到解析我想到的类似字符串/变量的方法

content = content.contains('[data-type="meta.code.data"]')[0].textContent;

但这不起作用。

Answer 1

这是不一样的，浏览器解析DOM，在这里您有一个包含所有网站数据的字符串，因此旧技术将不起作用。 我将亲自尝试使用DOM解析器（尽管我从未尝试在Node应用程序中使用它），但似乎有npm软件包的工作原理基本相同。

我假设您已经将npm与Node一起使用了，所以这里是确切模块的链接： https : //www.npmjs.com/package/xmldom

这是它如何运作的示例：

var DOMParser = require('xmldom').DOMParser;
var doc = new DOMParser().parseFromString(
    '<xml xmlns="a" xmlns:c="./lite">\n'+
        '\t<child>test</child>\n'+
        '\t<child></child>\n'+
        '\t<child/>\n'+
    '</xml>'
    ,'text/xml');
doc.documentElement.setAttribute('x','y');
doc.documentElement.setAttributeNS('./lite','c:x','y2');
var nsAttr = doc.documentElement.getAttributeNS('./lite','x')
console.info(nsAttr)
console.info(doc)

如您所见，您现在可以使用在浏览器中使用的功能，并且由于您已经知道该怎么做，因此您的问题现在消失了；）

我建议直接使用regex等解析该字符串，而不是直接解析DOM。如果您用Google搜索哪种方法更好，有很多原因。

Answer 2

正如@JonasW指出的那样，使用cheerio可以解决问题 。

首先在模块顶部声明cheerio：

const cheerio = require('cheerio');

然后加载内容并解析数据：

const $ = cheerio.load(content)
content = $('pre[data-type="meta.code.data"]').text()

综上所述：

.pipe(tap(function(file) {
    var content = file.contents.toString(),
        relPathPrefix = path.join(path.relative(file.path, './source'));

    relPathPrefix = relPathPrefix
        .replace(new RegExp('\\' + path.sep, 'g'), '/') // Normalize path separator
        .replace(/\.\.$/, ''); // Remove trailing ..

    content = content.replace(/('|")\//g, '$1' + relPathPrefix);

    //GET ONLY JSON DATA FROM STREAM
    const $ = cheerio.load(content)
    content = $('pre[data-type="meta.code.data"]').text()

    file.contents = Buffer.from(content);
}))