Question

我正在尝试创建包含页面上所有链接的3个HTML集合，因此我可以为每个类别的链接附加3个单独的函数。我的第一个HTML集合是“标题链接”，第二个是“页脚链接”，第三个是“所有其他链接”。我还需要附加链接跟踪功能和其他元素。

创建前两个集合非常简单，因为我可以做document.getElementById（'header'）;和document.getElementById（'footer'）;然后是this.getElementsByTagName（'a'）; 然而，获得“所有其他链接”的第三个集合有点棘手。没有一个干净的div只包含页面的“中间”，并且页眉和页脚之外的链接也很难单独输出。我希望我能做像allLinks = document.linnks这样的事情，然后过滤出第一和第二个HTML集合中已经存在的所有链接。

有什么办法吗？理想情况下，我想避免加载更多的库，欢迎纯JS

谢谢！

Answer 1

您可以将节点列表转换为数组，然后使用filter()提取已存在于其他列表中的链接：

var hdr = document.getElementById('header');
var hlinks = arrayOf(hdr.getElementsByTagName('a'));

var ftr = document.getElementById('footer');
var flinks = arrayOf(ftr.getElementsByTagName('a'));

var others = arrayOf(document.getElementsByTagName('a')).
filter(
  function(element) {
    return (hlinks.indexOf(element) < 0) && (flinks.indexOf(element) < 0);
  }
);

function arrayOf(nodelist)
{
  var result = [];
  for ( var i = 0; i < nodelist.length; ++i )
    result.push(nodelist.item(i));

  return result;
}

示例：http://codepen.io/paulroub/pen/ikebh

如果您需要支持缺少Array.prototype.filter()的旧浏览器，请添加this MDN page中的代码以在需要时实施。

根据其他HTML集合从HTML集合中删除项目

1 个答案: