Here we will continue from previous part of jQuery for Beginners Tutorial.
Filters for visibility
:hidden - Select all elements which have attribute to be hidden
:visible - Select all elements which not have attribute to be hidden
Filter for attributes
[attribute] - Select all elements which have specified attribute
jQuery for Beginners - Step by Step Tutorial (Part 3)
|
<div id="one">div 1</div>
<div id="two">div 2</div>
<div>div 3</div>
<div>div 4</div>
$("div[id]").mouseover(function(){
alert('test');
});
In this example we have four div elements, but only the first two divs have id attribute. If you move mouse over them an alert we be displayed.
[attribute=value] - Select all elements which have specified attribute and this attribute have specified value.
[attribute=value] - Select all elements which have specified attribute and this attribute have specified value.
<div id="one">div 1</div>
<div id="two">div 2</div>
<div>div 3</div>
<div>div 4</div>
$("div[id='one']").mouseover(function(){
alert('test');
});
In this example selected elements will be this which have id="one". If you move mouse over them an alert we be displayed.
[attribute!=value] - Select all elements which have specified attribute and this attribute is different from the specified value.
[attribute!=value] - Select all elements which have specified attribute and this attribute is different from the specified value.
<div id="one">div 1</div>
<div id="two">div 2</div>
<div>div 3</div>
<div>div 4</div>
$("div[id!='one']").mouseover(function(){
alert('test');
});
In this example selected elements will be this which have id="two", because 'div 3' and 'div 4' don't have attribute id, and 'div 2' have id attribute, but the value is equal to 'one' which we don't want. If you move mouse over them an alert we be displayed.
[attribute^=value] - Select all elements which have specified attribute and his value starts with specified value.
[attribute$=value] - Select all elements which have specified attribute and his value ends with specified value.
[attribute*=value] - Select all elements which have specified attribute and his value contains specified value.
Form Selectors
:input - Select all elements like input, textarea, select, button, etc.
:text - Select all elements of type text
:password - Select all elements of type password
:radio - Select all elements of type radio
:checkbox - Select all elements of type checkbox
:image - Select all elements of type image
Form Filters
:enabled - Select all elements which are enabled
:disabled - Select all elements which are not enabled
:checked - Select all elements which are checked
:selected - Select all elements which are selected
This tutorial show you basic jQuery features. Of course, jQuery offers many more features and tools like AJAX, effects, events, css manipulation, etc. and in our future tutorials we will cover them.
[attribute^=value] - Select all elements which have specified attribute and his value starts with specified value.
[attribute$=value] - Select all elements which have specified attribute and his value ends with specified value.
[attribute*=value] - Select all elements which have specified attribute and his value contains specified value.
Form Selectors
:input - Select all elements like input, textarea, select, button, etc.
:text - Select all elements of type text
:password - Select all elements of type password
:radio - Select all elements of type radio
:checkbox - Select all elements of type checkbox
:image - Select all elements of type image
Form Filters
:enabled - Select all elements which are enabled
:disabled - Select all elements which are not enabled
:checked - Select all elements which are checked
:selected - Select all elements which are selected
This tutorial show you basic jQuery features. Of course, jQuery offers many more features and tools like AJAX, effects, events, css manipulation, etc. and in our future tutorials we will cover them.
Next Tutorials
Post Comment
Need a specific tutorial? Do not hesitate and submit a request!
