如何使用Javascript创建具有特定自定义数据属性的div数组

Question

我在页面上有一堆div，其自定义数据属性为“data-type”

<div id="155544" data-type="form" data-form-id="155544">

<div data-type="question" data-question-id="119709" data-mandatory="True"></div>
<div data-type="question" data-question-id="119710" data-mandatory="True"></div>

</div>


<div id="155554" data-type="form" data-form-id="155554">

<div data-type="question" data-question-id="119711" data-mandatory="True"></div>
<div data-type="question" data-question-id="119712" data-mandatory="True"></div>

</div>

基本上是代码，我刚刚拿出实际内容以避免混淆。

我想使用Javascript来查找有多少div具有“表单”的数据类型，以便我对它们执行某些操作。

我发现这个Hide or show all divs for a certain value of a data attribute这与我想要做的类似，除了我试图不使用jQuery。

任何解决方案？

编辑：我还应该提一下，我试图不直接使用div“id”，因为它们是动态创建的

Answer 1

不使用JQuery，您可以使用querySelectorAll

elementList = document.querySelectorAll('div[data-type="form"]');

Demonstration（打印号码）

Answer 2

您可以使用querySelectorAll MDN获取一个Nodelist，如果您愿意，可以将其转换为数组（以及.namedItem()等松散的好东西）：

var divs = document.querySelectorAll('div[data-type="form"]');
var arrayOfDivs = Array.prototype.slice.apply(divs,[0]);