未捕获的SyntaxError:无法在“文档"上执行"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.

推荐答案

允许您使用

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

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