首頁猿問如何獲取同一個div里，...

如何獲取同一個div里，多個不同的子標簽的值？

JavaScript

慕森王 2018-12-06 23:53:15

如下面的代碼，為父元素<div>設置了id值，它里面有不同的標簽<strong>、<span>、<a>等子元素，我要怎么樣才能夠點擊父元素<div>然后能夠分別獲取到每個子標簽的值，并將其賦值到相應的input的文本框內容里。 <div href="#" id="l1" onclick="list(this.id)"> 　　<strong >Karitika Anggrain</strong> 　　<span >6222123****1234 </span> 　　<a href="#"> Maybank</a > </div> <div href="#" id="l1" onclick="list(this.id)">　　<strong >Karitika Anggrain</strong>　　<span >6222123****1234 </span>　　<a href="#"> Maybank</a ></div> <form role="form " class="col-md-4"> <input type="text" ?id="CName" name="cname"> <input type="text" ?id="BName"> <input type="text" ?id="CNo"> </form> 我寫的js代碼如下，只能獲取一個子標簽<srong>的值，本想按照同樣方法把其他的子標簽值也賦給對應input，但發現好像因為id的問題無法實現重復用，所以就只能獲取第一個子元素的值。 <script type="text/javascript"> function list(id){ 　　var myname=document.getElementById(id).getElementsByTagName("strong")[0].innerHTML; 　　document.getElementById("CName").value=myname; /* ?var ?mybank=document.getElementById(id).getElementsByTagName("span")[0].innerHTML;　　document.getElementById("BName").value=mybank;*/ } </script> ? 網各位大神幫幫忙，指導指導，非常謝謝！

查看完整描述

19 回答

莫回無

TA貢獻1865條經驗獲得超7個贊

jquery？

反對回復 2018-12-24

POPMUISE

TA貢獻1765條經驗獲得超5個贊

JavaScript最好，不介意的話也可以同時教練jq如何實現，謝謝！

反對回復 2018-12-24

紅顏莎娜

TA貢獻1842條經驗獲得超13個贊

@顧曉北:那jq是怎么實現呢？

反對回復 2018-12-24

慕村225694

TA貢獻1880條經驗獲得超4個贊

@顧曉北: 好的！謝謝提供學習網址~

反對回復 2018-12-24

忽然笑

TA貢獻1806條經驗獲得超5個贊

我理解能力有點差，好像沒怎么完全理解你的意思o.0(學習js也不久)，希望能幫到你

 1 <script type="text/javascript">
 2 function list(id){
 3 　　var oDiv=document.getElementById(id);
 4     var myname = oDiv.firstElementChild.innerHTML;
 5 　　document.getElementById("CName").value=myname;
 6     var myNumber = oDiv.firstElementChild.nextElementSibling.innerHTML;
 7     document.getElementById('BName').value = myNumber;
 8     var myBank = oDiv.lastElementChild.innerHTML;
 9     document.getElementById('CNo').value = myBank;
10 }
11 </script>

反對回復 2018-12-24

GCT1015

TA貢獻1827條經驗獲得超4個贊

@shoulder11: <span>可以oDiv.firstElementChild.nextElementSibling.nextElementSibling.innerHTML;

或者oDiv.lastElementChild.previousElementSibling.innerHTML;

當然有多個子元素時，上述方法就不太合適可以考慮使用childNodes屬性

第一個標簽<img>：oDiv.childNodes[0] //IE

　　　　　　　　　　oDiv.childNodes[1]? //其他瀏覽器會把元素之間的空白符也會算為子元素

第三個標簽<span>:oDiv.childNodes[2] //IE

　　　　　　　　　　oDiv.childNodes[5]? //其他瀏覽器

其他子元素可以以此類推；

反對回復 2018-12-24

犯罪嫌疑人X

TA貢獻2080條經驗獲得超4個贊

@shoulder11: 今天學習DOM擴展-專有擴展時，發現其中的children屬性可以解決不同瀏覽器在處理空白符是的差異，所以上述的方法可以寫成：

第一個標簽<img>：oDiv.children[0];

第三個標簽<span>:oDiv.children[2];

反對回復 2018-12-24

慕哥9229398

TA貢獻1877條經驗獲得超6個贊

@老板丶魚丸粗面: 這樣，我再去試試，太謝謝了。

TwT不過不好意思，圓豆沒有給成你TwT，因為有個方法更加簡單并且不需要給div設置id值，我最后用了他的方法。

但還是十分感謝！你也讓我學到了很多~

我也都記下來了嘿嘿。

反對回復 2018-12-24

弒天下

TA貢獻1818條經驗獲得超8個贊

document.getElementById('XXX').getElementsByTagName('span/strong')[0] ?

getElementXXX不止針對document哦

反對回復 2018-12-24

搖曳的薔薇

TA貢獻1793條經驗獲得超6個贊

document.getElementById('XXX').getElementsByTagName('span/strong')[0]

這樣的話它得出來的是兩個值吧？那要怎么接收它呢？

反對回復 2018-12-24

蝴蝶刀刀

TA貢獻1801條經驗獲得超8個贊

@shoulder11:?getElementsByTagName ? 有s ?是復數 ? 取索引對應的就行了

反對回復 2018-12-24

萬千封印

TA貢獻1891條經驗獲得超3個贊

其實你的js并沒有什么問題，問題在于你的兩個div的id都是相同的，那肯定只能一個能獲取到了。

另外，你這樣寫太麻煩，用jquery非常簡單

function list(id) {
var div = $("#" + id);
$("#CName").val(div.find("strong").text());
$("#BName").val(div.find("span").text());
$("#CNo").val(div.find("a").text());
}

反對回復 2018-12-24

米脂

TA貢獻1836條經驗獲得超3個贊

因為主要也想通過學習一些js的內容，但同時也會學習jq的。

非常謝謝~

反對回復 2018-12-24

19 回答
0 關注
885 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何獲取同一個div里， 多個不同的子標簽的值？

如何獲取同一個div里， 多個不同的子標簽的值？

19 回答

添加回答

如何獲取同一個div里，多個不同的子標簽的值？

如何獲取同一個div里，多個不同的子標簽的值？