1
1
---
2
- chapter : jquery-basics
3
- section : 2
4
- title : Selecting Elements
5
- attribution : jQuery Fundamentals
2
+ chapter : " js101"
3
+ section : " 2"
4
+ title : " Operators"
6
5
---
7
- ## Selecting Elements
6
+ ## Basic Operators
8
7
Selecting Elements
9
- >>>>>>> moved selecting-elements and doc-ready into jquery-basics folder try 2
10
8
11
9
The most basic concept of jQuery is to “select some elements and do something with them.”
12
10
jQuery supports most CSS3 selectors, as well as some non-standard selectors.
@@ -53,11 +51,7 @@ Pseudo-selectors
53
51
When you use the : visible and : hidden pseudo-selectors, jQuery tests the actual
54
52
visibility of the element, not its CSS visibility or display — that is, it looks
55
53
to see if the element's physical height and width on the page are both greater than zero.
56
- <<<<<<< HEAD
57
54
However, this test doesn't work with < ; tr> elements; in this case, jQuery does check
58
- =======
59
- However, this test doesn't work with <tr > elements; in this case, jQuery does check
60
- >>>>>>> moved selecting-elements and doc-ready into jquery-basics folder try 2
61
55
the CSS display property, and considers an element hidden if its display property
62
56
is set to none. Elements that have not been added to the DOM will always be
63
57
considered hidden, even if the CSS that would affect them would render them
@@ -72,33 +66,21 @@ For reference, here is the code jQuery uses to determine whether an element is v
72
66
skip = elem.nodeName.toLowerCase() === "tr";
73
67
74
68
// does the element have 0 height, 0 width,
75
- <<<<<<< HEAD
76
69
// and it's not a <tr>?
77
- =======
78
- // and it's not a <tr>?
79
- >>>>>>> moved selecting-elements and doc-ready into jquery-basics folder try 2
80
70
return width === 0 && height === 0 && !skip ?
81
71
82
72
// then it must be hidden
83
73
true :
84
74
85
75
// but if it has width and height
86
- <<<<<<< HEAD
87
76
// and it's not a <tr>
88
- =======
89
- // and it's not a <tr>
90
- >>>>>>> moved selecting-elements and doc-ready into jquery-basics folder try 2
91
77
width > 0 && height > 0 && !skip ?
92
78
93
79
// then it must be visible
94
80
false :
95
81
96
82
// if we get here, the element has width
97
- <<<<<<< HEAD
98
83
// and height, but it's also a <tr>,
99
- =======
100
- // and height, but it's also a <tr>,
101
- >>>>>>> moved selecting-elements and doc-ready into jquery-basics folder try 2
102
84
// so check its display property to
103
85
// decide whether it's hidden
104
86
jQuery.curCSS(elem, "display") === "none";
@@ -123,11 +105,7 @@ jQuery offers many attribute-based selectors, allowing you to make selections
123
105
based on the content of arbitrary attributes using simplified regular expressions.
124
106
125
107
<div class =" example " markdown =" 1 " >
126
- <<<<<<< HEAD
127
108
// find all <a>s whose rel attribute
128
- =======
129
- // find all <a>s whose rel attribute
130
- >>>>>>> moved selecting-elements and doc-ready into jquery-basics folder try 2
131
109
// ends with "thinger"
132
110
$("a[rel$='thinger']");
133
111
</div >
@@ -202,11 +180,7 @@ Sometimes you have a selection that contains more than what you're after; in thi
202
180
<div class =" example " markdown =" 1 " >
203
181
Refining selections
204
182
205
- <<<<<<< HEAD
206
183
$('div.foo').has('p'); // div.foo elements that contain <p>'s
207
- =======
208
- $('div.foo').has('p'); // div.foo elements that contain <p>'s
209
- >>>>>>> moved selecting-elements and doc-ready into jquery-basics folder try 2
210
184
$('h1').not('.bar'); // h1 elements that don't have a class of bar
211
185
$('ul li').filter('.current'); // unordered list items with class of current
212
186
$('ul li').first(); // just the first unordered list item
@@ -265,4 +239,4 @@ Selects inputs with type="text"
265
239
Using form-related pseduo-selectors
266
240
267
241
$('#myForm :input'); // get all elements that accept input
268
- </div >
242
+ </div >
0 commit comments