div標記陣列內標識元件唯一地

我有一個代碼如下div標記陣列內標識元件唯一地

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Accordion - Default functionality</title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css"> 
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
    <script> 
     $(function() { 
      $("#accordion").accordion(); 
     }); 

     var i = 1; 

     function pressMe() { 
      var h3 = document.createElement("h3"), 
       div = document.createElement("div"); 
      h3.appendChild(document.createTextNode('Section 4')); 
      div.appendChild(document.createTextNode('Saurabh')); 

      // note the reverse order of adding child   
      h3.appendChild(div); 

      //document.getElementById('accordion').appendChild(h3); 
      //$("#accordion").accordion(); 
      $("#accordion").append('<h3>Section ' + ++i + '</h3>   <div id=\'myDiv' + i + '\'>' + document.getElementById('temp').innerHTML + '</div>'); 
      $("#accordion").accordion("refresh"); 
     } 

     function hide() { 
      document.getElementById('temp').style.display = "none"; 
     } 

     function printAll() { 
      for (temp = 2; temp <= i; temp++) { 
       alert(document.getElementById('myDiv' + temp).getElementsByTagName('input')[0].value); 
      } 
     } 
    </script> 
</head> 

<body id="XXX" onload="hide()"> 
    <div id="accordion"> 
     <h3>Section 1</h3> 
     <div id='myDiv1'> 
      <input type="text" name="text1" id="text1"> 
     </div> 
    </div> 
    <input type="button" onclick="pressMe()" value="Add more Nodes"> 
    <input type="button" onclick="printAll()" value="printAll"> 
    <div> 
     <div id='temp'> 
      <input type="text" name="text1" id="id_text"> 
     </div> 
    </div> 
</body>

所有我想這樣做我想以唯一地識別所有的輸入由

document.getElementById('myDiv' + temp).getElementsByTagName('input')[0].value

未標記

但使用

document.getElementById('myDiv' + temp).getElementsById('id_text')[0].value

但無法檢索元素。

來源

2014-07-23 Mitesh Manani

沒有我稱爲'getElementsById'。爲什麼不只是'getElementById（「id_text」）'，因爲ID在頁面中必須是唯一的？ – Beterraba

document.getElementById('myDiv' + temp)回報HTMLElement其在它的原型（HTMLElement.prototype.getElementsByTagName）getElementsByTagName方法，並且沒有getElementsById方法。

但它有querySelector方法。您可以使用它像這樣：

document.getElementById('myDiv' + temp).querySelector('#id_text').value

來源

2014-07-23 14:13:31 Pinal

queryselector did not work out .. :( –

['所有作品']（http://jsfiddle.net/frontenddeveloping/26wA2/）... – Pinal

是的，它在jsfiddle，但不知道怎麼在鉻和IE。日食我檢查，它沒有顯示任何查詢選擇器方法。 –

如果你想獲得所有的ID和的元素的輸入值，那麼試試這個：

HTML：

<div id="accordion"> 
     <h3>Section 1</h3> 
     <div id='myDiv1'> 
      <input type="text" name="text1" id="text1" value="a"> 
      <input type="text" name="text1" id="text2" value="b"> 
      <input type="text" name="text1" id="text3" value="c"> 
     </div> 
    </div> 
    <input type="button" onclick="pressMe()" value="Add more Nodes"> 
    <input type="button" onclick="printAll()" value="printAll"> 
    <div> 
     <div id='temp'> 
      <input type="text" name="text1" id="id_text"> 
     </div> 
    </div>

jQuery：

$(document).ready(function(){ 
    var temp = 1; 
    var IDs = []; 
    var Values = []; 
    var Elements = []; 

    $("#myDiv" + temp).find("input").each(function(){ 
     IDs.push(this.id);   // for ID 
     Values.push($(this).val()); // for Value 
     Elements.push(this);   // for html tags 
    }); 
    alert(IDs); 
});

來源

2014-07-23 15:09:07 AmanVirdi

div標記陣列內標識元件唯一地

回答

相關問題