使用getElementsByTagName，然後使用getElementById

-2

我試圖從一個輸入的LI元素中獲得一個ID的值。使用getElementsByTagName，然後使用getElementById

但是，當我打電話給getElementsByTagName()[0].getElementsById()我得到錯誤numLi[i].getElementById is not a function numLi與LI元素的數組。這裏是我的整個js代碼

$('form').submit(function() 
{ 
    var headOne = document.getElementById('inputHead').value; 
    var archive = document.getElementById('inputPara').value; 
    var numLi = document.getElementById('uList').getElementsByTagName('li'); 
    var tagsToPost = ''; 
    for(i = 0;i<numLi.length;i++) 
    { 
     var ff = numLi[i].getElementById('tagOne'); 

     if(i<=numLi-1) 
     { 
      tagsToPost = tagsToPost + ff.value + ','; 
     } 
     else 
     { 
     tagsToPost = tagsToPost + ff.value; 
     } 
    } 

});

和HTML部分我試圖訪問該行var ff = numLi[i].getElementById('tagOne');

<form action="javascript:void(0);"> 
<div class="col-md-3"> 

    <div id="enlacesList"> 
     <ul id="uList"> 

       <li class='listaLink'><input type="text" id="tagOne" class="tags" placeholder="Tags" autocomplete="off"></li> 
       <li class='listaLink'><input type="text" id="tagOne" class="tags" placeholder="Tags" autocomplete="off"></li>  

     </ul> 
    </div> 
    <button id="addgregador" type="button" autocomplete="off"><span class="glyphicon glyphicon-plus"></span></button><button id="desadd" type="button" autocomplete="off"><span class="glyphicon glyphicon-minus"></span></button> 
</div> 
<div class="col-md-9" id="containerTexto"> 
    <div id="textoPregunta"> 
     <div id="textHeading"><input type="text" name="headingOne" id="inputHead" placeholder="Titulo de la pregunta" autocomplete="off"></div> 
     <div id="textContent"><textarea id="inputPara" rows="33" cols="84" placeholder="Respuesta, explicación..." autocomplete="off"></textarea></div> 
     <input type="submit" id="editOk" value="Enviar" class="btn btn-primary" autocomplete="off"><input type="reset" id="editNot" value="Cancelar" class="btn btn-danger" autocomplete="off"> 
    </div> 
</div>

程序中斷。

來源

2016-09-14 Yacomini

爲什麼在頁面上有多個元素具有相同的ID？ – epascarello

@epascarello它們是通過'ul'標籤上的兩個按鈕創建的，我只使用了相同的ID，因爲我在心裏用ID調用它們，我的問題的解決方案可能是使用'getElementsByTagName（'input'）[0 ]'，而不是'getElementById（''tagOne'）' – Yacomini

你不能擁有多個具有相同ID的元素。改用類。 – JJJ

getElementById函數僅在document上定義，不在DOM節點上。請參閱其MDN article。這是因爲IDS在文檔級別應該是唯一的，因此將其範圍限定到單個元素是沒有意義的。

因此，首先，不要在一個文檔中爲多個元素使用相同的ID。如果每個LI元素只有一個輸入，請刪除id屬性並像這樣獲取它們。

var ff = numLi[i].children[0];

來源

2016-09-14 14:30:25

我知道我不應該在不同的元素上使用相同的ID，但是因爲他們只是在那裏被js調用（因爲我認爲我的方式可行），我只是用它們，但現在我意識到我應該使用你的way或'numLi [i] .getElementsByTagName（'input'）[0]' – Yacomini

-2

你想這樣做：變種X =的getElementsByTagName（）[0] .ID document.getElementsById（X）.innerHTML = ....？

這可以濃縮到：

document.getElementsById(document.getElementsByTagName("Example:Div")[0].id)

來源

2016-09-14 14:31:44

只需調用的document.getElementById（「tagOne」）值來獲取值。

ID字段在您的html中也必須是唯一的，所以您需要重命名第二個以標記兩個或其他東西。該ID允許您在使用getElementById時直接轉到它們。這是不正確的HTML，並且通常會給您帶來具有相同ID字段的兩個元素的錯誤。（通過ID索引）

但我不認爲你可以使用getElementById在文檔以外的任何東西，但。自從我在UCSD開始我的網絡開發課程以來，這已經有一段時間了。

來源

2016-09-14 14:37:57 PeterB

事實上，您只能在文檔上調用'getElementById'。 – vlaz

使用getElementsByTagName，然後使用getElementById

回答

相關問題