Integration of jQuery knowledge points and jquery knowledge points

Integration of jQuery knowledge points and jquery knowledge points
I. jQuery Introduction

JQuery is a function library, a js file. You can use the script label to introduce js files on the page.

<Script type = "text/javascript" src = "js/jquery-1.12.2.js"> </script>

1. Official Website: http://jquery.com/

2. Download: http://code.jquery.com/

Ii. jQuery Loading

Writing statements for retrieving elements to the header of the page may cause errors because the elements are not loaded. jquery provides the ready method to solve this problem, which is faster than the native window. onload method.

Iii. jQuery selector 1. jQuery usage ideas

Select a webpage element and perform some operations on it

2. jQuery Selector

The jQuery selector can quickly select elements. The selection rules are the same as the css style, and the length attribute is used to determine whether the selection is successful.

A. Select the entire document object: $ (document)

B. Select All li elements: $ ("li ")

C. Select the webpage element whose id is myId: $ ("# myId ")

D. Select the element whose class is myClass: $ (". myClass ")

E. Select the input element whose name attribute is equal to first: $ ("input [name = first]")

F. Select the span element under all li values whose id is uli: $ ("# uli li span ")

3. Modify and filter the selector (similar to the CSS pseudo class)

A. Select the first li: $ ("# uli li: first") with the id of the uli element ")

B. Select the odd line of li with the id of uli: $ ("# uli li: odd") (starting from 0)

C. Select the third li: $ ("# uli li: eq (2)") under the uli element with id (starting from 0)

D. Select li :$ ("# uli li: gt (2)") after the first three values of the element whose id is uli )")

E. Select the input element in the form: $ ("# myForm: input ")

F. Select the visible div element: $ ("div: visible ")

4. Filter selector Functions

A. Select the div element containing the p element: $ ("div"). has ("p ")

B. Select the div element whose class is not equal to myClass: $ ("div"). not (". myClass ")

C. Select the div element whose class is equal to myClass: $ ("div"). filter (". myClass ")

D. Select the first div element: $ ("div"). first ()

E. Select the sixth div element: $ ("div"). eq (5)

5. selector Transfer

A. Select the first p element with id div2: $ ("# div2"). prev ("p ")

B. Select id as the first p element after the div element: $ ("# div"). next ("p ")

C. Select the form parent element closest to the div element: $ ("# div"). closest ("form ")

D. Select "id" as the parent element under the div element: $ ("# div"). parent ()

E. Select all child elements whose id is div: $ ("# div"). children ()

F. Select the same level element (except yourself) under the div element with id: $ ("# div"). siblings ()

G. Select the element whose class in the div is equal to myClass: $ ("# div"). find (". myClass ")

Iv. jQuery style operations

Value and value assignment for the same function

1. Operation line style

A. Get the div Style

B. Set the div Style

Note: The selector obtains multiple elements and obtains the first information. For example, $ ("div" ).css ("width") obtains the width of the first div.

2. Operation Style Class Name addClass, removeClass, toggleClass

A. append style float_left

B. Remove the float_left style.

C. Switch the active style repeatedly.