Question

我正在为Chrome扩展程序制作js函数，以替换Facebook新闻源中的内容。每个帖子都有uiUnifiedStory uiStreamStory genericStreamStory aid_1719315288 uiListItem uiListLight uiListVerticalItemBorder个班级，其中aid总是在变化。

如果我想获得所有课程，我不能只使用aid_*。

如何获得与li类匹配的所有uiUnifiedStory uiStreamStory genericStreamStory aid_* uiListItem uiListLight uiListVerticalItemBorder元素，其中援助可以是任何内容。

Answer 1

有许多库允许通过通配符进行选择，但您可以通过以下方式手动选择：

var elements = document.getElementsByClassName( /* class names other than aid_* ones */
var re = new RegExp('(^|\\s)aid_(\\s|$)'); 
var result = [];

for (var i=0, iLen=elements.length; i<iLen; i++) {
  if (re.test(elements[i].className)) {
    result.push(elements[i]);
  }
}

请注意，getElementsByClassName会返回实时NodeList，但结果将是一个本机数组（与getElementsByClassName的各种库实现返回的内容一样）。

你也可以使用querySelectorAll，我认为它比getElementsByClassName得到更广泛的支持。

修改

所以你试过了：

  var elements = document.getElementsByClassName('uiUnifiedStory uiStreamStory' +
                 ' genericStreamStory aid_173333252718885 aid_183319479511' +
                 ' uiListItem uiListLight uiListVerticalItemBorder');

  var re = new RegExp('(^|\\s)aid_(\\s|$)');
  var result = [];

  for (var i=0, iLen=elements.length; i<iLen; i++) {

    if (re.test(elements[i].className)) {
      result.push(elements[i]);
      elements.innerHTML = "<h6>benrox!</h6>";

Ooops，elements是一个NodeList，分配给它的innerHTML属性要么没有用，要么抛出错误。您可能想要设置NodeList的当前成员的属性：

      elements[i].innerHTML = "<h6>benrox!</h6>";
      --------^^^

请注意，如果您要添加内容，可以编辑问题。

在getElementsByClassName中使用通配符

1 个答案:

修改