Examples of use of spaces in the jquery selector and considerations _jquery

This digest is from "sharp jquery" and adds a little something of your own

The space in the selector can not be ignored, one more space or less a space may result in a different way. Let's look at an example.

first build the following HTML code:

Copy Code code as follows:

<div class= "Test" >
<div style= "Display:none;" >jquery Tutorials </div>
<div style= "Display:none;" >jquery Learning </div>
<div style= "Display:none;" >jquery Plugins </div>
<div class= "test" style= "Display:none;" >php Learning </div>
</div>
<div class= "test" style= "Display:none;" >jquery Plugin Tutorials </div>
<div class= "test" style= "Display:none;" >jquery Plug-in Learning </div>

jquery Code:

Copy Code code as follows:

var $test _a = $ (". Test:hidden");//jquery selector with space
var $test _b = $ (". Test:hidden");//jquery selector with no spaces
var len_a = $test _a.length;
var len_b = $test _b.length;
Alert (the jquery element chosen by the jquery selector with a space is: "+len_a+");/output is 4
Alert ("The jquery selector with no spaces is chosen as the jquery element:" +len_b+ ");/output is 3

There are different results, which is the difference between the descendant selector and the filter selector.

Copy Code code as follows:

var $test _a = $ (". Test:hidden");//jquery selector with space

The above code is a hidden element in the element that selects class "Test". (descendant selector)

Copy Code code as follows:

var $test _b = $ (". Test:hidden");//jquery selector with no spaces

The code above is to select the hidden class "test" element

Note:
The use of some selectors, must be a space, if not with a space, it can not take elements, such as:

Copy Code code as follows:

$ ("select:selected"). length;//no matter at any time, this selector will not get the element, this length must be 0
$ ("select:selected");//This is the right thing to do.

The use of some selectors, must be without spaces, if with a space, it can not take elements, such as:

Copy Code code as follows:

$ ("input:checked"). length;//no matter at any time, this selector will not get the element, this length must be 0
$ ("input:checked");//This is the right thing to do.