使用ID的一部分查找元素

Question

我有,divid在哪里this_div_id_NUMBER,所有人div都有不同的NUMBER部分.我怎么发现所有人div只是使用this_div_id了id的一部分？

Answer 1

你可以使用querySelectorAll来命中部分属性,包括ID:

document.querySelectorAll("[id^='this_div_id']")

等号旁边的^表示"以...开头",您可以使用*代替,但它容易出现误报.

您还要确保在attrib选择器中的comapare值周围使用引号(或者),以便在querySelectorAll上获得最大的兼容性; 在jQuery和常青浏览器中它并不重要,但对于旧浏览器而言,它确实很重要.

编辑:迟到的要求需要一个更具体的选择器:

document.querySelectorAll("[id^='this_div_id']:not([id$='_test_field'])");

not()段阻止以"_test_field"结尾的任何内容进行匹配.

概念验证/演示:http://pagedemos.com/partialmatch/

Answer 2

querySelectorAll

querySelectorAll接受CSS选择器并返回与该css选择器匹配的所有元素的HTMLNodeList(一种数组).

css选择器^(以...开头)可用于您的目的.在本文中了解有关它的更多信息.

对于你的情况,它会 document.querySelectorAll("[id^='this_div_id']");

请注意,querySelectorAll不会返回实时节点列表.这意味着,对dom的任何更改都不会在函数的返回值中实时更新.

另一种方法是将所有元素分配给一个特定的类,然后你可以使用getElementsByClassName(比querySelector快得多).

var divs = document.getElementsByClassName("divClass");