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

如何獲取同一個div里，多個不同的子標(biāo)簽的值？

JavaScript

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

如下面的代碼，為父元素<div>設(shè)置了id值，它里面有不同的標(biāo)簽<strong>、<span>、<a>等子元素，我要怎么樣才能夠點(diǎn)擊父元素<div>然后能夠分別獲取到每個子標(biāo)簽的值，并將其賦值到相應(yīng)的input的文本框內(nèi)容里。 <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代碼如下，只能獲取一個子標(biāo)簽<srong>的值，本想按照同樣方法把其他的子標(biāo)簽值也賦給對應(yīng)input，但發(fā)現(xiàn)好像因?yàn)閕d的問題無法實(shí)現(xiàn)重復(fù)用，所以就只能獲取第一個子元素的值。 <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> ? 網(wǎng)各位大神幫幫忙，指導(dǎo)指導(dǎo)，非常謝謝！

查看完整描述

19 回答

莫回?zé)o

TA貢獻(xiàn)1865條經(jīng)驗(yàn) 獲得超7個贊

jquery？

反對回復(fù) 2018-12-24

POPMUISE

TA貢獻(xiàn)1765條經(jīng)驗(yàn) 獲得超5個贊

JavaScript最好，不介意的話也可以同時教練jq如何實(shí)現(xiàn)，謝謝！

反對回復(fù) 2018-12-24

紅顏莎娜

TA貢獻(xiàn)1842條經(jīng)驗(yàn) 獲得超13個贊

@顧曉北:那jq是怎么實(shí)現(xiàn)呢？

反對回復(fù) 2018-12-24

慕村225694

TA貢獻(xiàn)1880條經(jīng)驗(yàn) 獲得超4個贊

@顧曉北: 好的！謝謝提供學(xué)習(xí)網(wǎng)址~

反對回復(fù) 2018-12-24

忽然笑

TA貢獻(xiàn)1806條經(jīng)驗(yàn) 獲得超5個贊

我理解能力有點(diǎn)差，好像沒怎么完全理解你的意思o(jì).0(學(xué)習(xí)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>

反對回復(fù) 2018-12-24

GCT1015

TA貢獻(xiàn)1827條經(jīng)驗(yàn) 獲得超4個贊

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

或者oDiv.lastElementChild.previousElementSibling.innerHTML;

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

第一個標(biāo)簽<img>：oDiv.childNodes[0] //IE

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

第三個標(biāo)簽<span>:oDiv.childNodes[2] //IE

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

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

反對回復(fù) 2018-12-24

犯罪嫌疑人X

TA貢獻(xiàn)2080條經(jīng)驗(yàn) 獲得超4個贊

@shoulder11: 今天學(xué)習(xí)DOM擴(kuò)展-專有擴(kuò)展時，發(fā)現(xiàn)其中的children屬性可以解決不同瀏覽器在處理空白符是的差異，所以上述的方法可以寫成：

第一個標(biāo)簽<img>：oDiv.children[0];

第三個標(biāo)簽<span>:oDiv.children[2];

反對回復(fù) 2018-12-24

慕哥9229398

TA貢獻(xiàn)1877條經(jīng)驗(yàn) 獲得超6個贊

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

TwT不過不好意思，圓豆沒有給成你TwT，因?yàn)橛袀€方法更加簡單并且不需要給div設(shè)置id值，我最后用了他的方法。

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

我也都記下來了嘿嘿。

反對回復(fù) 2018-12-24

弒天下

TA貢獻(xiàn)1818條經(jīng)驗(yàn) 獲得超8個贊

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

getElementXXX不止針對document哦

反對回復(fù) 2018-12-24

搖曳的薔薇

TA貢獻(xiàn)1793條經(jīng)驗(yàn) 獲得超6個贊

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

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

反對回復(fù) 2018-12-24

蝴蝶刀刀

TA貢獻(xiàn)1801條經(jīng)驗(yàn) 獲得超8個贊

@shoulder11:?getElementsByTagName ? 有s ?是復(fù)數(shù) ? 取索引對應(yīng)的就行了

反對回復(fù) 2018-12-24

萬千封印

TA貢獻(xiàn)1891條經(jīng)驗(yàn) 獲得超3個贊

其實(shí)你的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());
}

反對回復(fù) 2018-12-24

米脂

TA貢獻(xiàn)1836條經(jīng)驗(yàn) 獲得超3個贊

因?yàn)橹饕蚕胪ㄟ^學(xué)習(xí)一些js的內(nèi)容，但同時也會學(xué)習(xí)jq的。

非常謝謝~

反對回復(fù) 2018-12-24

19 回答
0 關(guān)注
868 瀏覽

關(guān)注

添加回答

舉報(bào)

0/150

提交

取消

第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

熱搜

最近搜索清空

如何獲取同一個div里， 多個不同的子標(biāo)簽的值？

如何獲取同一個div里， 多個不同的子標(biāo)簽的值？

19 回答

添加回答

如何獲取同一個div里，多個不同的子標(biāo)簽的值？

如何獲取同一個div里，多個不同的子標(biāo)簽的值？