Javascript 未捕获的语法错误：无法在“文档”上执行“querySelector”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/37270787/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Uncaught SyntaxError: Failed to execute 'querySelector' on 'Document'
提问by boycod3
'<button id="'+item['id']+'" class="btnDeactivateKeyInChildPremiumCustomer waves-effect waves-light>ok</button>'
I used above code for generating button inside of jquery each function.The button created dynamically and when i clicked the button , it should show the progress on the button. Im using this Ladda Button Loader.
我使用上面的代码在 jquery 每个函数内部生成按钮。按钮是动态创建的，当我点击按钮时，它应该显示按钮的进度。我正在使用这个Ladda Button Loader。
btnDeactivateKeyInChildPremiumCustomerClick : function(event){
var id = event.currentTarget.id;
var btnProgress = Ladda.create(document.querySelector('#'+id));
//btnProgress.start(); or //btnProgress.stop();
}
And then i passed the button the event handler catch the event process the above function.Inside that function it will create a btnProgressobject. After that i can call start() or stop() functions.I have successfully worked the in the case of only one button without creating the button dynamically inside each . But in the for each case it is showing some errors while executing var btnProgress = Ladda.create(document.querySelector('#'+id));
然后我将按钮传递给事件处理程序捕获事件处理上述函数。在该函数内部，它将创建一个btnProgress对象。之后，我可以调用 start() 或 stop() 函数。在只有一个按钮的情况下，我成功地工作了，而没有在每个按钮内动态创建按钮。但在每种情况下，它在执行var btnProgress = Ladda.create(document.querySelector('#'+id)); 时显示一些错误。
Error
错误
Uncaught SyntaxError: Failed to execute 'querySelector' on 'Document': '#22' is not a valid selector.
回答by undefined
You are allowed to use IDs that start with a digitin your HTML5 documents:
您可以在 HTML5 文档中使用以数字开头的 ID：
The value must be unique amongst all the IDs in the element's home subtree and must contain at least one character. The value must not contain any space characters.
There are no other restrictions on what form an ID can take; in particular, IDs can consist of just digits, start with a digit, start with an underscore, consist of just punctuation, etc.
该值在元素的主子树中的所有 ID 中必须是唯一的，并且必须至少包含一个字符。该值不得包含任何空格字符。
对于 ID 可以采用的形式没有其他限制；特别是，ID 可以仅包含数字、以数字开头、以下划线开头、仅包含标点符号等。
But querySelectormethod uses CSS3 selectors for querying the DOM and CSS3 doesn't support ID selectors that start with a digit:
但是querySelectormethod 使用 CSS3 选择器来查询 DOM 并且 CSS3 不支持以数字开头的 ID 选择器：
In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit.
在 CSS 中，标识符（包括元素名称、类和选择器中的 ID）只能包含字符 [a-zA-Z0-9] 和 ISO 10646 字符 U+00A0 及更高，加上连字符 (-) 和下划线 ( _); 它们不能以一个数字、两个连字符或一个连字符后跟一个数字开头。
Use a value like b22for the ID attribute and your code will work.
使用类似b22ID 属性的值，您的代码将起作用。
Since you want to select an element by ID you can also use .getElementByIdmethod:
由于您想通过 ID 选择元素，您还可以使用.getElementById方法：
document.getElementById('22')
回答by CodingIntrigue
Although this is valid in HTML, you can't use an ID starting with an integer in CSS selectors.
尽管这在 HTML 中有效，但您不能在CSS 选择器中使用以整数开头的 ID 。
As pointed out, you can use getElementByIdinstead, but you can also still achieve the same with a querySelector:
正如所指出的，您可以getElementById改用，但您仍然可以通过以下方式实现相同的效果querySelector：
document.querySelector("[id='22']")
