DOM遍历cheerio - 如何使用相应的文本获取所有元素

时间:2017-10-12 00:48:52

标签: javascript node.js cheerio dom-traversal

所以我正在使用 Cheerio ,一个类似于节点服务器端的jQuery的库,它允许你解析一个html文本并像你一样遍历它用jQuery。我需要获取html正文的纯文本,但不仅如此,我需要获取相应的元素和数字。 IE:如果在第三段元素中找到纯文本,我会有类似的东西:

{
    text: <element plaintext>,
    element: "p-3"
}

我目前有以下功能试图这样做:

var plaintext_elements = traverse_tree($('body'));    

function traverse_tree(root, found_elements = {}, return_array = []) {
    if (root.children().length) {
        //root has children, call traverse_tree on that subtree
        traverse_tree(root.children().first(), found_elements, return_array);
    }
    root.nextAll().each(function(i, elem) {
        if ($(elem).children().length) {
            //if the element has children call traverse_tree on the element's first child
            traverse_tree($(elem).children().first(), found_elements, return_array)
        }
        else {
            if (!found_elements[$(elem)[0].name]) {
                found_elements[$(elem)[0].name] = 1;
            }
            else {
                found_elements[$(elem)[0].name]++
            }
            if ($(elem).text() && $(elem).text != '') {
                return_array.push({
                    text: $(elem).text(),
                    element: $(elem)[0].name + '-' + found_elements[$(elem)[0].name]
                })
            }
        }
    })


    if (root[0].name == 'body') {
        return return_array;
    }

}

我是否朝着正确的方向前进,我应该尝试别的吗?任何有关这方面的帮助将不胜感激。这又是不是jQuery ,而是服务器端的Cheerio。 (但它们非常相似)

1 个答案:

答案 0 :(得分:0)

我认为如果使用* css选择器

,则不需要进行大量遍历
function textElements($){
  const found = {}
  return $('body *').map(function(el){
    if ( $(this).children().length || $(this).text() === '' ) return
    found[this.name] = found[this.name] ? 1 + found[this.name] : 1
    return {
      text: $(this).text(),
      element: `${this.name}-${found[this.name]}`,
    }
  }).get()
}

textElements(cheerio.load(html)