Okay, start my jquery first day.
I started with Hello wrod!, too. The reference to jquery I took directly. As follows:
Copy Code code as follows:
<title>jquery chain-type operation </title>
<script type= "Text/javascript" src= "Jquery-1.3.1.js" ></script>
<script type= ' Text/javascript ' >
$ (document). Ready (function () {
Alert ("Hello word!");
Still Right-click
$ (document). Bind ("ContextMenu", function (e) {
return false;
// });
});
</script>
<body>
</body>
Let's take a look at a complex example that lets us know what a chain operation of jquery is:
I use. To connect a chain of jquery operations.
Maybe some people just started to learn query, it seems strange, in the back of the crazy jquery I will explain one after the other. Slowly you will understand.
Copy Code code as follows:
<title>jquery chain-type operation </title>
<script type= "Text/javascript" src= "Jquery-1.3.1.js" ></script>
<style type= "Text/css" >
#menu {width:300px}
. has_children {
Background: #555; color: #fff; cursor:pointer;
}
. Highligt{color: #fff; background:green;}
div{padding:0;margin:0px;}
Div a {
Background: #888;d isplay:none;float:left;width:300px;
}
</style>
<script type= ' Text/javascript ' >
$ (document). Ready (function () {
Alert ("Add click event to all Directories");
$ (". Has_children"). Click (function () {
$ (this). addclass (' highligt ')//Add Highligt class for the current element.
. Children ("a"). Show (). End ()//To display the <a> elements of child nodes. and relocate to the last element of the operation
. siblings (). Removeclass ("highligt")//Get the elements of the sibling. (or sibling elements), and remove them from the Highligt class
. Children ("a"). Hide (); Hides the elements of the sibling, the <a> elements under the sibling element
});
});
</script>
<body>
<div id= ' Menu ' >
<div class= ' Has_children ' >
<span> the first chapter know jquery</span>
<a>1.1 JavaScript and JavaScript libraries </a>
<a>1.2 joins Jquery</a>
<a>1.3 write a simple jquery code </a>
<a>1.4 jquery objects and Dom objects </a>
<a>1.5 resolve conflicts between jquery and other libraries </a>
<a>1.6 Jquery Development tools and Plug-ins </a>
<a>1.7 Summary </a>
</div>
<div class= ' Has_children ' >
<span> Chapter II jquery selector </span>
What is the <a>2.1 Jquery selector? </a>
The advantages of <a>2.2 Jquery selector? </a>
<a>2.3 Jquery Selector </a>
<a>2.4 application jquery Rewrite instance </a>
Some considerations in the <a>2.5 selector </a>
<a>2.6 Case study ———— similar to Taobao brand list effect </a>
<a>2.7 do you have any other selectors? </a>
<a>2.8 Summary </a>
</div>
<div class= ' Has_children ' >
<span> Chapter III the DOM operations in jquery </span>
Operations classification of <a>3.1 Dom </a>
Dom operations in <a>3.2 Jquery </a>
<a>3.3 Case Study ———— hyperlinks and picture effects for a website </a>
<a>3.4 Summary </a>
</div>
</div>
</body>
