使用querySelectorAll時，有沒有辦法引用上下文節點的直接子節點，而不使用ID？

說我有一個HTML的結構像使用querySelectorAll時，有沒有辦法引用上下文節點的直接子節點，而不使用ID？

<div id="a"> 
    <div id="b"> 
    <div id="c"></div> 
    </div> 
</div>

要做到爲「A」使用querySelectorAll的孩子查詢我可以這樣做

//Get "b", but not "c" 
document.querySelectorAll('#a > div')

我的問題是：是否有可能如果沒有ID，直接引用節點？我試着做

var a_div = document.getElementById('a') 
a_div.querySelectorAll('> div') //<-- error here

但我得到一個錯誤告訴我，我使用的選擇器是無效的。

而如果你想知道，我的實際使用情況會更復雜的東西像「>包含.foo的.bar .baz」，所以我寧願避免手動DOM遍歷。目前，我正在向根div添加一個臨時ID，但這看起來像一個醜陋的黑客...

來源

2012-07-11 hugomg

另請參閱：http://stackoverflow.com/questions/3680876/use-queryselectorall-to-retrieve-direct-children – natevw 2014-11-11 19:23:05

不，沒有辦法^（還）引用一些元素的所有孩子，而不使用引用那個元素。因爲>是一個child combinator，它表示父元素和子元素之間的關係，因此需要一個simple selector（父級）（在您的示例中缺少該元素）。

在評論，BoltClock said該Selectors API Level 2 specification限定方法findAll^{名稱可以變化}「，它接受作爲參數什麼可能會被稱爲相對選擇器（選擇器可以與一個組合子開始，而不是一個複合選擇器）「。
當此實現，可以使用如下：

a_div.findAll('> div');

來源

2012-07-11 20:18:31

這是通常的解決方法是什麼？是否向根元素添加（臨時）ID是唯一方法？ – hugomg 2012-07-11 20:23:14

@missingno是的。另一種方法是遍歷所有的'.childNodes'，並使用'childNodes [i] .nodeName.toUpperCase（）=='div''來測試這個孩子是否是一個div。 – 2012-07-11 20:28:48

更具體地說，「因爲'>'是* combinator *」，所以你不能用'querySelectorAll（）'來做到這一點。在不久的將來，你可以用'findAll（）'做到這一點，它接受什麼可能被稱爲相對選擇器（一個選擇器，可以開始與combinator，而不是一個複合選擇器）作爲參數。請參閱[選擇器API級別2]（http://www.w3.org/TR/selectors-api2）規範。 – BoltClock 2012-07-12 06:37:37

-2

我想我一定是誤解了你的問題，但是這是我如何解釋呢..

var a = document.getElementById('a') 
var results = a.querySelectorAll('div');

結果將會保存你所有的子div。

來源

2012-07-11 20:20:03 jeschafe

'結果'不僅會持有子div，而且還會持有**所有**子div。 – 2012-07-11 20:20:58

我想從結果中排除「c」div。 '#a> div'選擇器只返回「b」格。 – hugomg 2012-07-11 20:21:54

document.querySelector('#a').querySelectorAll(':scope > div')

我不確定瀏覽器的支持，但我用它在鉻和鉻移動打包的應用程序，它工作正常。

來源

2014-11-29 08:18:06

[MDN on'：scope' in'querySelector']（https://developer.mozilla.org/en-US/docs/Web/CSS/:scope#Browser_compatibility）：Chrome，Firefox 32+，Safari 7，不是歌劇，而不是IE。 – 2015-06-30 01:02:14

使用querySelectorAll時，有沒有辦法引用上下文節點的直接子節點，而不使用ID？

回答

相關問題