Home > Developer > JavaScript
Here is a simple example:
Copy codeThe Code is as follows:
<Html> <Meta type-equiv = "Content-Type" content = "text/html">
<Meta charset = "UTF-8">
<Script type = "text/javascript">
Jq = jQuery. noConflict ();
Jq = (document). ready (function (){
Jq ("a"). mouseover (function (){
Jq ("a" ).css ("color", "# c00 ″);
});
Jq ("A'). mouseout (function (){
Jq ("a" ).css ("color", "#000000 ″);
});
</Script>
</Head> <body>
<A href = "www.jb51.net"> place the cursor over it to see what will happen. </a>
</Body>
Jq = jQuery. noConflict ();
This is the jquery library name that defines a js;
Jq (document). ready (function (){
/* This is a function about the document object. It contains the function content */
});
Jq ("a"). mouseover () function (){
/* This is the content that defines the event mouseover */
}.
Let's look at an example. Hide the text when you click it:
Copy codeThe Code is as follows:
<Html> <Script type = "text/javascript">
$ (Document). ready (function (){
$ (". Abc. hide"). click (function (){
$ ("This"). parents ("abc"). hide ("slow ");});});
</Script>
<Stype type = "text/css">
Div. abc {
Background: # e5eec;
Padding: 7px;
Margin: 0px;
Border: solid 1px # c00 ;}
</Stype>
</Head> <body>
<Div class = "abc">
<P> <button class = "abc" type = "button"> hide <button> <br/>
This text will be hidden <br/>
This text will also be hidden
</P> </div>
<Div class = "abc"> <p>
<Button class = "abc" type = "button"> hide me </button> <br/>
This text is hidden when you click hideme. <br/>
The text is also hidden.
</P> </dvi>
</Body>
Our homework is almost the same. Let's get back to the topic drop-down box.
Copy codeThe Code is as follows:
<Html> <! -Author linuxa
Blogs: www.jb51.net->
<Meta http-equiv = "content-type" content = "text/html">
<Meta charset = "UTF-8">
<Title> Create a drop-down box </title>
</Head> <body>
</Body>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
