Question

我是JavaScript的初学者。我试图了解如何在js中使用DOM ...

我想从一些网站获得一个文本，无论结构多么复杂，都可以从每个DIV获得。如果我在下面运行我的代码，它将给我文本但是： patern div从儿童div给我他的文字和文字...然后孩子div给我他的文字... 所以得到了很多重复的文字。

var items = document.body.getElementsByTagName('*');
for(var i=0; i<items.length; i++)
{
  document.write(items[i].textContent);
}

了解当前文本的节点对我来说很重要所以我不能使用它，因为我得到了文本，但我不知道文本的节点：

var body = document.body, textContent = 'textContent' in body ? body.textContent : body.innerText;
document.write(textContent);

我知道解决方案是jQuery。但我正在尝试理解如何在JS中执行此操作。

Answer 1

您可以尝试使用jQuery .get（）函数获取所有匹配元素。

示例：

var elements = [];
elements = $('div').get();

一旦你拥有了所有元素，你就可以从每个元素中获取文本（如果有的话）并将其存储在另一个数组中，如下所示：

var textStrings = [];
var len = elements.length;
for(var a = 0; a < len; a++)
    textStrings[a] = elements[a].text();

第二个代码块将遍历第一个元素数组并从每个元素中提取文本，并将其保存在名为textStrings的第二个数组中。＆＃39; len＆＃39;变量用于优化JavaScript代码并阻止浏览器评估元素。长度＆＃39;每次循环。

希望这有帮助。

Answer 2

在这种情况下，通常textContent或innerHTML方法失败，因为.innerHTML包含子节点的HTML。

但您可以使用另一个属性：childNodes。此列表不仅包含子元素，还包含所有子节点，包括文本节点：

var items = document.body.getElementsByTagName('*');
for(var i=0; i<items.length; i++)
{
  var currItem = items[i];
  for(var j = 0; j < currItem.childNodes.length; ++j)
  {
    if(currItem.childNodes[j].nodeName === "#text")
    {
      // the current child node is a text node
      document.write(items[i].textContent);
    }
  }
}

由于每个节点在DOM中都有一个唯一的位置，这将确保每个节点只写一次。

参考文献：

W3C：DOM Level 3（官方文件）
- Node.nodeName
- Node.childNodes
Mozilla开发者网络（更易于理解）
- Node.nodeName
- Node.childNodes

使用javascript从HTML获取文本

2 个答案:

参考文献：