Examples of dom operations and events in jquery learn the effects of the yahoo Mail logon box.

But it seems boring to write it like this.

The advantage of jquery is that simple code can bring a better user experience.

So I will look for some practical examples to introduce them. The following describes the operations and events used in this section.

Html code:

<Input type = "text" id = "address" value = "enter email address"/>

Jquery code:
Copy codeThe Code is as follows:
$ (Document). ready (function (){
$ ('# Address'). focus (function (){
Var add_value = $ (this). val ();
If (add_value = "Enter the email address "){
$ (This). val ("");
}
})
$ ('# Address'). blur (function (){
Var add_value = $ (this). val ();
If (add_value = ""){
$ (This). val ("Enter your email address ");
}
})
});

The result is that the value in the address box is cleared when the address box gets the mouse focus. 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 focus, and blur () is triggered when the jquery object loses the mouse focus.

This section describes other mouse events. Mouseover () is triggered when the mouse moves into the object. Mouseout () is triggered when the mouse moves out of an object. Mousemove () is triggered when the mouse moves in the object.

The dom operations of jquery used:

Val () is to get the value of the element value, you can also set the value of the element value. This method for obtaining and setting in a function is very common in jquery.

Class is also html (), text (), heigth (), width (), css (), attr () and so on.

Html () and text () are distinguished here ()

Html () is relative to the html code in the object, while text () is only the text content in the object

For example, <p> <strong> difference </strong> </p>

Certificate ('p'0000.html (). The result is <strong> difference </strong>

$ ('P'). text (). The result is different

The introduction and expansion of this instance mentioned above.