如何選擇沒有標識或類的元素？

我試圖從本質上選擇元素內的元素。該HTML看起來是這樣的：如何選擇沒有標識或類的元素？

<!DOCTYPE html> 
<html> 
    <head></head> 
    <body> 
    <div class="first"> 
     <div></div> 
     <div><!-- the element I want to select --></div> 
    </div> 
    </body> 
</html>

我已經嘗試了一個方法，它看起來像這樣：

function findFirstDescendant(parent, tagname) { 
    parent = document.getElementsByClassName(parent)[0]; 
    var descendants = parent.getElementsByTagName(tagname); 
    if (descendants.length) 
    return descendants[0]; 
    return null; 
}

而且這樣的：

document.getElementsByClassName("first")[0].getElementsByTagName("div")[1];

無論是工作，方法似乎過時。我想保留jQuery，但如果沒有其他解決方案，這是可以接受的。

來源

2017-05-18 DaFudgeWizzad

你的第二次嘗試表現爲預期爲我工作Chrome瀏覽器：https：//jsfiddle.net/Obsidian_Age/ay4a990L/ –

這似乎是一個瀏覽器兼容性問題。你正在使用哪種瀏覽器？ – shaochuancs

@shaochuancs我在Chrome上使用了tampermonkey擴展。 – DaFudgeWizzad

對不起浪費任何人的時間。我覺得有點愚蠢，因爲沒有早點想到這一點。我通過向腳本添加250ms延遲來解決問題，因爲它在頁面完全加載之前正在執行。我的代碼是與此類似：

setTimeout(function() { 
    var a = document.getElementsByClassName("card-player")[0].getElementsByTagName("div")[0]; 
    console.log(a); 
}, 250);

你也可以添加更多的變量，如果你想調試或日誌的詳細信息如下：

setTimeout(function() { 
    var a = document.getElementsByClassName("first")[0]; 
    var b = a.getElementsByTagName("div")[1]; 
    var c = b.getElementsByTagName("div")[1]; 
    var d = b.getElementsByTagName("div")[2]; 
}, 250);

來源

2017-05-19 00:05:00 DaFudgeWizzad

您應該將'javascript'代碼放在頁面底部或代碼放在'document.onload = function（）{/ * code here * /}'中，而不是使用延遲。 –

'setTimeout'是一個非常糟糕的解決方案。使用IIFE，'window.onload'或'DOMContentLoaded'。 – Badacadabra

你一定要使用querySelector利用CSS選擇器...

var el = document.querySelector('.first > div:nth-child(2)'); 
 
console.log(el);

<!DOCTYPE html> 
 
<html> 
 
    <head></head> 
 
    <body> 
 
    <div class="first"> 
 
     <div></div> 
 
     <div>Hello!</div> 
 
    </div> 
 
    </body> 
 
</html>

但很明顯，你可以用這個也比較經典的解決方案：

var el = document.getElementsByClassName('first')[0].getElementsByTagName('div')[1]; 
 
console.log(el);

<!DOCTYPE html> 
 
<html> 
 
    <head></head> 
 
    <body> 
 
    <div class="first"> 
 
     <div></div> 
 
     <div>Hello!</div> 
 
    </div> 
 
    </body> 
 
</html>

來源

2017-05-18 23:56:53 Badacadabra

如何選擇沒有標識或類的元素？

回答

相關問題