getElementById()通配符

Question

我有一个div,并且我有一些未定义级别的子节点.

现在我必须将每个元素的ID更改为一个div.如何实现？

我想,因为他们有上传ID,所以如果父亲是id ='path_test_maindiv',那么下一个downer将是'path_test_maindiv_child',因此我想,我会通过通配符解决这个问题,例如:

document.getElementById('path_test_*')

这可能吗？或者还有其他方法吗？

Answer 1

不是原生JavaScript.你有各种选择:

1)放置一个类并使用getElementsByClassName,但它不适用于每个浏览器.

2)自己动手.就像是:

function getElementsStartsWithId( id ) {
  var children = document.body.getElementsByTagName('*');
  var elements = [], child;
  for (var i = 0, length = children.length; i < length; i++) {
    child = children[i];
    if (child.id.substr(0, id.length) == id)
      elements.push(child);
  }
  return elements;
}

3)使用库或CSS选择器.像jQuery;)

Answer 2

在其中一条评论中你说:

(...)IE无论如何都被禁止在我的页面上,因为他没有用CSS获取它.它是开发人员的管理工具,所以只有少数人,他们无论如何都会使用FF

我认为你应该从一开始就采用不同的方法,但是对于它的价值,在较新的浏览器(ok,FF3.5)中,你可以使用document.querySelectorAll()它来获得类似的结果,如jQuery:

var elements = document.querySelectorAll('[id^=foo]');
// selects elements which IDs start with foo

更新: querySelectorAll()只未在IE <8和FF 3.0支持.

Answer 3

jQuery允许您查找特定属性以特定值开头的元素

在jQuery中你会使用

$('[id^="path_test_"]')

Answer 4

在 2019 年尝试将此作为通配符。

document.querySelectorAll("[id*=path_test_]")