未捕获的语法错误:无法在“文档"上执行“querySelector" [英] Uncaught SyntaxError: Failed to execute 'querySelector' on 'Document'

问题描述

<button id="'+item['id']+'" class="btnDeactivateKeyInChildPremiumCustomer waves-effect waves-light">ok</button>

我使用上面的代码在jquery每个函数内部生成按钮.按钮是动态创建的，当我点击按钮时，它应该显示按钮的进度.我正在使用这个 Ladda Button Loader.

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.

btnDeactivateKeyInChildPremiumCustomerClick : function(event){
   var id = event.currentTarget.id;
   var btnProgress = Ladda.create(document.querySelector('#'+id));
   // btnProgress.start(); or btnProgress.stop();
}

然后我将按钮传递给事件处理程序捕获事件处理上述函数.在该函数内部，它将创建一个 btnProgress 对象.之后我可以调用 start() 或 stop() 函数.我在只有一个按钮的情况下成功地工作了，而没有在每个按钮内动态创建按钮.但在每种情况下，它在执行 var btnProgress = Ladda.create(document.querySelector('#'+id));

And then i passed the button the event handler catch the event process the above function.Inside that function it will create a btnProgress object. 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));

错误

Uncaught SyntaxError: Failed to execute 'querySelector' on 'Document': '#22' is not a valid selector.

推荐答案

您可以使用 HTML5 文档中以数字开头的 ID:

该值在元素的主子树中的所有 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.

对于 ID 可以采用的形式没有其他限制；特别是，ID 可以仅包含数字、以数字开头、以下划线开头、仅包含标点符号等.

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.

但是 querySelector 方法使用 CSS3 选择器来查询 DOM 并且 CSS3 不支持以数字开头的 ID 选择器:

But querySelector method uses CSS3 selectors for querying the DOM and CSS3 doesn't support ID selectors that start with a digit:

在 CSS 中，标识符(包括元素名称、类和选择器中的 ID)只能包含字符 [a-zA-Z0-9] 和 ISO 10646 字符 U+00A0 及更高，加上连字符 (-) 和下划线 (_);它们不能以一个数字、两个连字符或一个连字符后跟一个数字开头.

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.

为 ID 属性使用类似 b22 的值，您的代码将起作用.

Use a value like b22 for the ID attribute and your code will work.

由于您想通过 ID 选择元素，您也可以使用 .getElementById 方法:

Since you want to select an element by ID you can also use .getElementById method:

document.getElementById('22')

这篇关于未捕获的语法错误:无法在“文档"上执行“querySelector"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！