The difference between querySelector and $()

The

page has the following elements 

<div class="list-box">
    <div class="buttonrideo">
        <input id="aBtn" type="checkbox" class="default-1"/>
    </div>
</div>

<div class="list-box">
    <div class="buttonrideo">
        <input id="bBtn" type="checkbox" class="default-1"/>
    </div>
</div>

jquery script: 

var a = document.querySelector("-sharpaBtn");
var b = $("-sharpaBtn");
What"s the difference between

an and b? Found that b [0] = = a, why?

Jquery javascript
Mar.04,2021

document.querySelector is the browser-level API, that selects the first satisfied DOM node based on the parameters.

The $in the

jquery script can only be used after introducing jquery, which is also the selector of dom. Select an array of DOM nodes that meet the conditions. Now jquery seems to be the native DOM element, so $('- sharpaBtn') [0] is equivalent to document.querySelector ('- sharpaBtn')

.
  1. an is the DOM native element object returned by (calling querySelector)
  2. b is the jQ wrapper object returned by calling jQ's $/ jQuery, or jQuery constructor. The jQ wrapper object contains both native DOM objects and some jQ's own things
  3. b [0] = = a because the jQ wrapper object stores the native DOM object in the location of key [0] (which you'll know as soon as you console)

an is a js object, b is a jquery object

third-class and ok, $('- sharpdom') [0] has indeed become a complete dom object

suggest that the owner take a look at the DOM object and jQuery object and how to convert them into

    .
  • document.querySelector () browser, which is queried as DOM object
    • The API, query provided by
  • $() for jQuery comes out as a jQuery object, and the jQuery object [0] is equal to the corresponding DOM object .

first of all, the $() function is in the JQuery class library, and querySelector () is included in html5.

The behavior of

$() is to find all matching elements and encapsulate them into jQuery objects for ease of use. The behavior of
querySelector () is to find the first element that matches, and the returned value is the native DOM object.

using the square bracket operator on the jQuery object returns the native DOM object, so b [0] returns the first native DOM object that matches the selector, so it is equal to the value a returned by querySelector () .

then there is a querySelectorAll () method in html5, which returns a NodeList object that can be iterated over. The behavior of this method may be more similar to jQuery's $() . 

let a = document.querySelectorAll('-sharpaBtn');
let b = $('-sharpaBtn');

a[0] === b[0];  //

Previous: Mysql is set to unsigned and double without reporting errors when inserting numbers less than 0

Next: After getting the information about json, how do I write an A tag to make it jump to another page and display the content?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b3fcfb-4db5f.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b3fcfb-4db5f.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?