quertySelector返回空值是什么？

querySelector在搜索id“#b> a时返回null，但getElementById返回正确的元素。这是怎么回事？quertySelector返回空值是什么？

var x = document.querySelector('#b>a'); 
 
console.log(x); 
 
var y = document.getElementById("b>a"); 
 
console.log(y);

Name <input type="text" id="b>a">

2017-08-09 Karan Dhir

选择为什么你需要，因为它是高度预计麻烦运行ID这样的名字？ – reporter

的>字符在CSS选择器语法意义。你必须使用"#b\>a"。

>是“直接子女”组合子，所以普通"#b>a"选择一个<a>元素，它是您的元素的ID为“b”的子元素。

2017-08-09 13:21:08 Pointy

...在这种情况下，您可能只需使用document.getElementById（），除非您的用例需要选择器。 – BoltClock

它被称为组合器;） – BoltClock

@BoltClock同意，虽然使用选择器并不奇怪或不好或什么都不是，特别是在某种工具/框架情况下。 *编辑*是当它我试图记住这个词;在我的防守中，我正在打电话;） – Pointy

您需要转义>字符。请参见下面的代码片段

var x = document.querySelector('#b\\>a'); 
 
console.log(x); 
 
var y = document.getElementById("b>a"); 
 
console.log(y);

Name <input type="text" id="b>a">

2017-08-09 13:21:58

通过选择查询将寻找类型的角色前，所以它会寻找的，而不是文字。

为了得到这个工作，你需要使用逃生

var x = document.querySelector('#b\\>a');

2017-08-09 13:22:16

回答