We often need to change the node properties, content, and text, and we need to use some of these functions.
1 Properties
Here we see a attr () function with four forms where attr (name) is given a selected attribute value, attr (properties) attr (Key,value) attr (KEY,FN) is assigned to a property
The point here is that in jquery there is a design that takes the value of an object and assigns a value to an object using the same function, using FN (name) to assign a value to an object, and using FN (Name,value) to assign a value to an object.
Let's see how attr (name) can get an attribute value.
We have
So we want to get the value of STC in IMG. First we use the selector to select this img $ ("img") to get the node above, and then we use attr () to get the value of SRC: $ ("img"). attr ("src")
So we get the 1.jpg value.
Now we want to change the 1.jpg image to 2.jpg, using $ ("img"). attr ("src", "2.jpg"), this is the form of FN (Name,key), of course, we know that JavaScript The onclick may be a function, of course other properties can also be functions, so our key can also be a function $ ("img"). attr ("src", function () {return ' 3.jpg '}), This is the second form that is actually the same as the first one.
The third, which is attr (properties), is to assign values in the JOSN format to Name:value, which is very common in jquery and is very clearly structured.
For example, we want to set img ALT and SRC can be written directly into $ ("img"). attr ({src: "4.jpg", alt: "description"})
In general, we should add, modify and delete the system. We said the first two, then how to delete a property?
Here's a removeattr (name) to use here it's easy to understand and ARRT (name) just the opposite, one is to get a property, one is to delete a property $ ("img"). REMOVEATTR ("alt")
Okay, let's summarize some of the functions of the Operation properties
Find: $ ("img"). attr ("src") find the value of SRC
Add/Modify $ ("img"). attr ("src", "2.jpg") $ ("img"). attr ("src", function () {return "2.jpg"}) $ ("img"). attr ({src: "2.jpg"})
Delete $ ("img"). Removeattr ("src")
2 CSS Class
When we need to give a node such as
<div></div>
To add a CSS style, what do we need to do?
We follow the above attributes in the way we first write a class style in CSS. sty{...}, we select this div and add a class $ ("div") to him. attr ("Class", "sty"),
Later we found that this was not too much trouble, so we invented the AddClass (class) to the above to abbreviate
$ ("div"). addclass ("Sty") is finished.
Since there are additions of course it is unavoidable to delete the $ ("div"). Removeclass ("sty") Delete sty This class
There is also a function toggleclass (class) that is deleted if it exists and is added if it does not exist.
This is really a very weird function. What's the use of this, like we're in a group of
<ul>
<li><li>
<li><li>
<li><li>
</ul>
We can achieve the mouse movement by adding this function to the mouse and the mouse move.
3 HTML
Here we see an HTML () and an HTML (val) function of the type of FN (name) FN (Name,value) that we said earlier
HTML () is the HTML class capacity to get the first matching element
HTML (val) is the class capacity of the HTML that sets the matching node
4 Text
There are also two functions here. Text () text (val) One is the value of the set value and HTML almost
The difference is that HTML () is the HTML class tolerance for the first element to be matched, while text is all the text obtained and ignores the HTML node
And the value of the text () on the HTML of the class, such as <a></a> will be converted to text and HTML () still interpreted as HTML elements
5 Value
It's still the same. Val () and Val (Val) One is to get the value, one is to set the value such as
<input value= "some text"/>
We get this value some text $ ("input"). Val ()
Set this value $ ("input"). Val ("Xxiu")
We've read about the attributes here, and we've found that we've only seen a few functions.
attr (NAME[,VAL,|FN]) removeattr (name) add settings to delete a property
AddClass (Class) Removeclass (Class) Add settings to delete a class
HTML ([Val]) gets/sets a heml
Text ([Val]) gets/sets a text
Val ([Val]) gets/sets a value
