jquery Learning---jquery deep learning

Source: Internet
Author: User

Property manipulation

$ ("P"). Text () $ ("P"). HTML () $ (": CheckBox"). Val ()

$ (". Test"). attr ("Alex") $ (". Test"). attr ("Alex", "SB")

$ (". Test"). attr ("Checked", "checked") $ (": CheckBox"). Removeattr ("checked")

$ (". Test"). Prop ("checked", true)

$ (". Test"). AddClass ("Hide")

<body>      <input id= ' ck ' type= "checkbox" School= "Peking" ></body><script src= "jquery-3.2.1.js The ></script>//attr represents a custom property, a parameter bid property, 2 parameters representing the parameter and a parameter value of $ ("#ck"). attr ("Checked", "true");    Add the attribute checked$ ("#ck"). Removeattr ("checked");     Canceling the property checked  in JQ3, the cancellation attribute cannot be used with attr ("Checked", "false"), and the intrinsic property "remove//and Prop" ("#ck") must be represented with selected checked. Prop ("Checked", true);  $ ("#ck"). Prop ("checked", false);    Note here that the Boolean value is not quoted, the cancellation attribute in JQ3 cannot be removed, the unquoted boolean value must be used </script>

Initial value:

Modified with prop: custom property modification failed, fixed property modification succeeded [there is a attributes collection inside, the setting success or not is related]

Modify with attr [at this time id=xxx]:attr can be modified successfully [internal has 2 states, true and false, custom default undefied]

To summarize:

JQ3: The cancellation of the attr must remove; Prop the use of unquoted boolean parameters

intrinsic properties [select,checked] with prop; Custom Attributes with attr

Document processing

Insert $ ("#c1") internally. Append ("<b>hello</b>") $ ("P"). AppendTo ("div")

Prepend () prependto ()

external Insert before () insertbefore () after InsertAfter ()

ReplaceWith () Remove () empty () Clone ()

To take a value action:

<! DOCTYPE html>

Direct insert for parent-child class:

<! DOCTYPE html>

Deletion of file operations:

Remove (): Delete this tab and the contents

Empty (): The content is only the case, but the label is retained

jquery Event Binding Supplemental delegate

$ (' li '). Click (function () {    //Method one}) $ (' Li '). On (' click ', Function () {    //Method two})//jquery-based delegate binding $ (' TD '). ON (' Click ', '. Td-delete ', function () {   $ ('. Remove,. Shade '). Removeclass (' Hide ')})
Event Bindings:

"More References" http://jquery.cuishifeng.cn/ready.html

Operation under 1.DOM

2. jquery operation [removed on onclick ()]

Operation "Review" under the DOM:

<! DOCTYPE html>

jquery Method Review: Implementing CSS styles:

<! DOCTYPE html>

OnLoad under jquery ()

Cancel event: Unload ()

<! DOCTYPE html>

Page Loading of jquery

Ready (FN)

Event Bindings for jquery: Click (), bind (), on (), and other event-bound operations

Cancel event: Off (), etc.;

<! DOCTYPE html>

The callback function of jquery:
<! DOCTYPE html>
How to extend jquery:

Custom extensions [jquery calls]

custom extensions [tag invocation]

The extension of the private domain [the custom function is placed inside a function to make calls to ensure that internal variables are not called externally], variables are only inside the function ha ~

<! DOCTYPE html>

Use of For loops in jquery

Use of the For loop in jquery:

1. Array, use of key-value pairs

2. Value of the collection

<script src= "Jquery-3.2.1.js" ></script><script>    //For loop: Array, json key-value    li = [ 1,2,3,4,5,6,7];    KV = {name: "Hello", Value: "World"};    $.each (Kv,function (key, value) {        console.log (key,value);    }) </script>

For loop Collection printing: "Note $ symbol"

<! DOCTYPE html>

jquery Learning---jquery deep learning

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.