But it feels so boring to write.
The advantage of jquery is that simple code can lead to a better user experience.
So just look for a few examples of what I feel practical, and introduce them. Incidentally, introduce the operations and events used therein.
HTML code:
<input type= "text" id= "address" value= "Please enter the mailbox"/>
jquery Code:
Copy Code code as follows:
$ (document). Ready (function () {
$ (' #address '). focus (function () {
var add_value=$ (this). Val ();
if (add_value== "Please enter a mailbox address") {
$ (this). Val ("");
}
})
$ (' #address '). blur (function () {
var add_value=$ (this). Val ();
if (add_value== "") {
$ (this). val ("Please enter your email address");
}
})
});
The effect of the implementation is that when the address box gets the mouse focus, the value in the Address box is emptied. When the mouse focus is lost, the Address box restores the default settings.
Describes the jquery events used here:
Focus () is triggered when the jquery object gets the mouse Spotlight, blur () is triggered when the jquery object loses the mouse focus
Incidentally, the events of the other mouse are introduced. MouseOver () is a mouse-moving object trigger. Mouseout () mouse moves out of the object trigger. MouseMove () is triggered when the mouse is moved in the object.
The DOM operation of jquery used:
Val () is the value that gets the element value, or it can set the value of the element value. This method of getting and setting within a function is common in jquery
The class is also HTML (), text (), Heigth (), Width (), CSS (), attr (), and so on.
Here is the distinction between HTML () and text ()
HTML () is relative to the HTML code in the object, and text () is just the text content in the object
Give an example <p><strong> difference </strong></p>
$ (' P '). html (). The result is <strong> difference </strong>
$ (' P '). Text (). The result is the difference
This is the introduction and extension of this example.