1, attr (NAME|PROPERTIES|KEY,VALUE|FN)
Description: Sets and returns the property value of the selected element
Example:
Parameters:
Name (property name) |
String |
Properties (as property's ' name/value pair ' object) |
Map |
Key,value (property name, property value) |
String,object |
Key,function (index,attr) 1. Property name 2. The function that returns the value of the property, the first parameter is the index value of the current element, and the second parameter is the original property value. |
String,function |
Description: Parameter name, which returns the SRC attribute value of all image img in the document
jquery Code
$ (' img '). attr (' src ')
Description: Parameter property, setting ALT and SRC attributes for all image img Elements
jquery Code:
$ (' img '). attr ({src: ' test.jpg ', alt: ' Test Image '});
Description: Parameter key,value, setting src attribute for all image img Elements
jquery Code:
$ (' img '). attr (' src ', ' test.jpg ');
Description: Parameter key, callback function, set the value of the SRC attribute to the value of the title property
jquery Code:
$ (' img '). attr (' title ', function () { return this.src;});
2, removeattr (name)
Description: Removes an attribute from each of the matched elements
1.6 The following version of IE6 using jquery's Removeattr method to remove disabled is not valid. The workaround is to use $ ("XX"). Prop ("disabled", false);
Version 1.7 has been supported to remove disabled under IE6.
Example:
Description: Deletes the SRC attribute of an image in a document
HTML code:
<src/>
jquery Code:
$ (' img '). removeattr (' src ');
Results:
</> ]
3, prop (NAME|PROPERTIES|KEY,VALUE|FN)
Description: Gets the property value of the first element in a matching element collection
With some built-in properties for DOM elements or window objects, the browser may produce an error if the property is attempted to be deleted. jquery first assigns a property of the undefined value, ignoring any errors generated by the browser
Example:
Parameters:
Name (property name) |
String |
Properties (as property's ' name/value pair ' object) |
Map |
Key,value (property name, property value) |
String,object |
Key,function (index,attr) 1. Property name 2. The function that returns the value of the property, the first parameter is the index value of the current element, and the second parameter is the original property value. |
String,function |
Description: Parameter name, check box is true, not checked to false
HTML code:
<inputtype= "checkbox"checked= "Checked" /><inputtype= "checkbox" /><inputtype= "checkbox"checked= "Checked" /><inputtype= "checkbox" /><inputtype= "checkbox"checked= "Checked" /><inputtype= "text" /><inputtype= "button"value= "Submit" />
jquery Code:
$ (' input[type= ' checkbox "] '). Prop (' checked ');
Description: Parameter properties, prohibit and select all check boxes on page
jquery Code:
$ (' input[type= ' checkbox "] '). Prop ({disabled:true});
Description: Parameter Key,value, disable and select all check boxes on the page
jquery Code:
$ (' input[type= ' checkbox "] '). Prop ({checked:true}); $ (' input[type= ' checkbox '] '). Prop ({disabled:true});
Description: Parameter key, callback function, function to set all check boxes on the page to be selected
jquery Code:
$ (' input[type= ' checkbox "] '). Prop (' Checked ', function (index,val) { return true;});
4, Removeprop (name)
Description: Used to delete a property set set by the. Prop () method
With some built-in properties for DOM elements or window objects, the browser may produce an error if the property is attempted to be deleted. jquery first assigns a property of the undefined value, ignoring any errors generated by the browser
Example:
Description: Sets a paragraph number property and then deletes it.
jquery Code:
$ (' P '). Prop (' Luggagecode ', 1234); $ (' P '). Prop (' Luggagecode '); $ (' P '). Removeprop (' Luggagecode '); $ (' P '). Prop (' Luggagecode ');
5, AddClass (CLASS|FN)
Description: Adds the specified class name for each matching element.
Example:
Parameters:
Class (one or more CSS class names to add to the element, separated by a space) |
String |
function (Index,class) This function must return one or more space-delimited class names The 1.index parameter is the index value of the object in this collection The 2.class parameter is the original class attribute value for this object |
function |
Description: Parameter class, adding ' selected ' class for matching elements
jquery Code:
$ ("P"). AddClass ("selected"); $ ("P"). addclass ("selected1 selected2");
Description: Parameter function, add a different class to Li
jquery Code:
$ (' ul Li '). addclass (function (index,cls) { return ' item-' + Index;})
6, Removeclass ([CLASS|FN])
Description: Removes all or a specified class from all matching elements
Example:
Parameters:
Class (one or more CSS class names to add to the element, separated by a space) |
String |
function (Index,class) This function must return one or more space-delimited class names The 1.index parameter is the index value of the object in this collection The 2.class parameter is the original class attribute value for this object |
function |
Description: Parameter class, removing the ' selected ' class from the matching element
jquery Code:
$ ("P"). Removeclass ("selected");
Description: Parameter function, delete the last element on the previous repeating class
jquery Code:
$ (' Li:last '). Removeclass (function () { return $ (this). Prev (). attr (' class ');});
7, Toggleclass (CLASS|FN[,SW]) Note: If the tag already contains class, the class name will be deleted, or new
Description: Deletes (adds) a class if it exists (does not exist).
Example:
Parameters:
Class (classes name) |
String |
Class,switch 1: CSS class name to toggle 2. A Boolean value that determines whether an element contains a class. |
String,boolean |
Switch (the Boolean value that determines whether the element contains a class.) ) |
Boolean |
function (index, class,switch) [, switch] 1: A function that returns the name of the style class used to toggle on each element in the matching element collection. Receives the index position of the element and the element's old style class as an argument. 2: A Boolean value that is used to determine whether the style class is added or removed. |
Function,boolean |
Description: Parameter class, Toggle ' selected ' class for matching elements
jquery Code:
$ ("P"). Toggleclass ("selected");
Description: Parameter Class,switch, add a ' highlight ' class to three clicks per click
jquery Code:
var count = 0;$ (' P '). Click (function () { $ (this). Toggleclass (' highlight ', count++% 3 = = 0)});
Description: Parameter function, set class property according to parent element
jquery Code:
$ (' Div.foo '). Toggleclass (function () { if ($ (). Parent (). is ('. Bar ') { return ' happy '; } else { Return ' sad '; }});
8. HTML ([VAL|FN])
Description: Gets the HTML content of the first matching element. This function cannot be used with XML documents. But it can be used in XHTML documents.
In an HTML document, we can use the. html () method to get the contents of any one element. If the selector matches more than one element, only the HTML content of the first matching element is fetched.
Example:
Parameters:
Val (value for setting HTML content) |
String |
function (index,html) This function returns an HTML string 1.index is the index position of the element in the collection 2.html is the original HTML value |
function |
Description: No parameter, returns the contents of the P element.
HTML code:
< P >< span >jQuery</span></p>
jquery Code:
$ (' P '). html ();
Results:
"<span>jQuery</span>"
Description: Parameter val, setting the contents of all P elements
HTML code:
< P ></ P >
jquery Code:
$ (' P '). html ('<span>hello,world</span>')
Description: Parameter function, which uses functions to set the contents of all matching elements.
HTML code:
< P ></ P > < P ></ P > < P ></ P >
jquery Code:
$ (' P '). HTML (function (index) { return '<span>hello,item ' +index + ' </ span > ';});
9. Text ([VAL|FN])
Description: Gets the contents of all matching elements.
The result is text that is combined with the text content contained by all matching elements. This method is valid for both HTML and XML documents.
Example:
Parameters:
Val (text used to set the content of the element) |
String |
function (Index,text) This function returns a string 1.index is the index position of the element in the collection 2.text is the original text value |
function |
No more details
10. Val ([Val|fn|arr])
Description: Gets the current value of the first element in the matching element collection.
In JQuery 1.2, you can return the value of any element. Includes select. If multiple selections, an array is returned that contains the selected value.
Example:
Parameters:
Val (the value to set) |
String |
function (Index,value) This function returns a value to set 1.index is the index position of the element in the collection 2.value is the original value |
function |
Array (value for Check/select) |
Array (String) |
Description: No parameters, gets the value in the text box
HTML code:
<inputtype= "checkbox"checked= "Checked" /><inputtype= "checkbox" /><inputtype= "checkbox"checked= "Checked" /><inputtype= "checkbox" /><inputtype= "checkbox"checked= "Checked" /><inputtype= "text" /><inputtype= "button"value= "Submit" />
jquery Code:
$ (' input[type=text] '). Val ()
Description: Parameter val, setting the value of the text box
jquery Code:
$ (' input[type=text] '). Val (' Hello World ')
Description: Parameter array, setting the value of a select and a multi-select Select
HTML code:
<SelectID= "single"> <option>Single</option> <option>Single2</option></Select><SelectID= "multiple"multiple= "multiple"> <optionselected= "Selected">Multiple</option> <option>Multiple2</option> <optionselected= "Selected">Multiple3</option></Select><BR/><inputtype= "checkbox"value= "Check1"/>Check1<inputtype= "checkbox"value= "Check2"/>Check2<inputtype= "Radio"value= "Radio1"/>Radio1<inputtype= "Radio"value= "Radio2"/>Radio2
jquery Code:
$ ("#single"). Val ("Single2"), $ ("#multiple"). Val (["Multiple2", "Multiple3"]); $ ("input"). Val (["Check2", "Radio1"]);
jquery Learning Summary 02-Properties