自定義屬性問題

我試圖同時獲取多個元素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">

來源

2012-05-16 larin555

您遇到的問題是getElementsById()不存在（除非您在其他地方定義了它）。你應該是使用是getElementById()，儘管兩次（如getElementById()，正如它的名字所暗示的，僅返回一個元素，即使有與同id，這是無效的加價多個元素，所以請不要拿做T的是），然後按下返回的元素到數組：

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']));

JS Fiddle demo。

請記住，雖然，它返回規則陣列，不一個nodeList（如將返回，例如，通過getElementsByClassName()）。而且返回的數組，即使它只有一個元素，也必須以與其他數組相同的方式進行迭代。

參考文獻：

來源

2012-05-16 15:34:06

所以它看起來像：productMinimum：document.getElementById（「products」）。getAttribute（「quantity」）？我不確定要理解。謝謝！ – larin555

是的，這似乎是一個有效的用法，假設你想獲得（product）的id爲（single）元素的屬性'quantity'的屬性值。 –

你一次只能得到一個元素（getElementById()）。如果你想包含大量的數組，這樣做：

[document.getElementById('id1').getAttribute('quantity'), document.getElementById('id2').getAttribute('quantity')]

考慮使用jQuery，那裏可以使用$('#id1, #id2')，此外，它支持方便地訪問data-屬性 - 你現在在做什麼，是無效的HTML，因爲li沒有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">

要獲取量數組：

$('#id1, #id2').map(function() { return $(this).data('quantity'); }).get();

來源

2012-05-16 15:33:40 ThiefMaster

它如何看起來像使用jQuery？ – larin555

查看我的更新回答 – ThiefMaster

有沒有這樣的功能getElementsById。您可以使用getElementsByClassName或getElementsByName

https://developer.mozilla.org/en/DOM/document.getElementsByName https://developer.mozilla.org/en/DOM/document。getElementsByClassName

請注意，getElementsByClassName是相當新的，不受舊版瀏覽器支持。

來源

2012-05-16 15:35:02 jbabey

使用純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")

來源

2012-05-16 15:35:21 antyrat

正如我understand it，document.getElementById需要一個ID在當時

而且，考慮使用HTML5自定義data attributes

來源

2012-05-16 15:35:31 MilkyWayJoe

function getQuantity(id) { 
return document.getElementById(id).getAttribute("quantity"); 
} 

var quantId1 = getQuantity('id1'); 
var quantId2 = getQuantity('id2');

getElement * s * ById返回一個數組。您需要獲取單個項目。如果你有很多元素，你可以通過類產品選擇並編寫一個簡單的函數來遍歷它們並創建一個數組。

來源

2012-05-16 15:37:16

有沒有這樣的事情getElementsById()

但有querySelectorAll，但它的not supported in IE7 and older though

here's a sample應在一個節點列表返回兩個<li>。

document.querySelectorAll('#id1, #id2')

來源

2012-05-16 15:38:38 Joseph

自定義屬性問題

回答

相關問題