Uncaught SyntaxError Failed to execute querySelector on Document

Question

lt button id  quot   item  id     quot  class  quot btnDeactivateKeyInChildPremiumCustomer waves-effect waves-light quot  gt ok lt  button gt   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       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    Error Uncaught SyntaxError  Failed to execute  querySelector  on  Document     22  is not a valid selector

User · Answer

Although this is valid in HTML  you can t use an ID starting with an integer in CSS selectors   As pointed out  you can use getElementById instead  but you can also still achieve the same with a querySelector   document querySelector   id  22

User · Answer

You are allowed to use IDs that start with a digit in your HTML5 documents   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   But querySelector method uses CSS3 selectors for querying the DOM and CSS3 doesn t support ID selectors that start with a digit   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   Use a value like b22 for the ID attribute and your code will work  Since you want to select an element by ID you can also use  getElementById method  document getElementById  22

[javascript] Uncaught SyntaxError: Failed to execute 'querySelector' on 'Document'

Examples related to javascript

Examples related to jquery

Examples related to backbone.js