我正在尝试同时获取多个元素ID的“数量”属性。
这是我试过的:
productMinimum : document.getElementsById("id1","id2").getAttribute("quantity")
我该如何使这项工作? “id1”和“id2”元素都具有“数量”属性。
以下是HTML方面的内容:
<li class="product" name="RD-101" id="id1" price="18" quantity="2">
<li class="product" name="RD-101" id="id2" price="18" quantity="4">
答案 0 :(得分:3)
您遇到的问题是getElementsById()
不存在(除非您已在其他地方定义)。你应该使用的是getElementById()
,尽管两次(如getElementById()
,顾名思义,只返回一个元素,即使有具有相同id
的多个元素,这是无效的标记,所以请不要这样做),然后将返回的元素推送到数组中:
var products = [];
products.push(document.getElementById("id1"));
products.push(document.getElementById("id2"));
当然,你可以创建自己的函数来根据id
返回多个元素:
function getElementsById(ids) {
if (!ids) {
return false;
}
else {
var elems = [];
for (var i = 0, len = ids.length; i < len; i++) {
if (document.getElementById(ids[i])) {
elems.push(document.getElementById(ids[i]));
}
}
return elems;
}
}
console.log(getElementsById(['id1','id3']));
请记住,这会返回一个常规数组, 不 一个nodeList
(例如,将返回{{1} }})。返回的数组,即使它只是一个元素,也必须以与任何其他数组相同的方式进行迭代。
参考文献:
答案 1 :(得分:1)
function getQuantity(id) {
return document.getElementById(id).getAttribute("quantity");
}
var quantId1 = getQuantity('id1');
var quantId2 = getQuantity('id2');
getElement * s * ById返回一个数组。你需要得到个别物品。如果你有很多元素可以按类产品选择并编写一个简单的函数来循环它们并创建一个数组。
答案 2 :(得分:0)
您一次只能获得一个元素(使用getElementById()
)。如果您想要一个包含数量的数组,请使用:
[document.getElementById('id1').getAttribute('quantity'), document.getElementById('id2').getAttribute('quantity')]
考虑使用jQuery,你可以使用$('#id1, #id2')
,而且它支持轻松访问data-
属性 - 你现在正在做的是无效的HTML,因为li
没有{ {1}}或price
属性:
quantity
获取数量数组:
<li class="product" name="RD-101" id="id1" data-price="18" data-quantity="2">
<li class="product" name="RD-101" id="id2" data-price="18" data-quantity="4">
答案 3 :(得分:0)
没有getElementsById
这样的功能。您可以使用getElementsByClassName
或getElementsByName
https://developer.mozilla.org/en/DOM/document.getElementsByName https://developer.mozilla.org/en/DOM/document.getElementsByClassName
请注意getElementsByClassName
相当新,不受旧浏览器的支持。
答案 4 :(得分:0)
使用纯JavaScript,您需要为此编写自己的函数:
function getQuantities() {
var args = Array.prototype.slice.call(arguments);
var quantityValue = 0;
for(var i = 0; i < args.length; i++) {
quantityValue += document.getElementsById(args[i]).getAttribute("quantity");
}
return quantityValue;
}
// your code
productMinimum : getQuantities("id1","id2")
答案 5 :(得分:0)
当我understand it时,document.getElementById
当时只占用一个ID
另外,请考虑使用html5自定义data attributes
答案 6 :(得分:0)
没有getElementsById()
但有querySelectorAll
,但它是not supported in IE7 and older though
here's a sample应返回节点列表中的两个<li>
。
document.querySelectorAll('#id1, #id2')