2017-6-3 DOM operations and events in jquery

---restore content starts---

(i) Events in jquery

1. General events, the JS event to remove the

Composite event: Hover (function () {},function () {})----equivalent to moving the mouse into the move-out event and executing it together

Toggle (function () {},function () {},....) Can write multiple, click event Loop execution

Future elements: Objects. Live ("Event name", function () {}); ---Action on elements created in the future

　The following: Click the button to create the element and add a click event to the Created element

　　Object. append (); add element under what object $ ("content to create in HTML")
$ ("#boss"). Append ($ ("<div class= ' Div1 ' ></div>"));

<%@ Page language="C #"autoeventwireup="true"codefile="Default.aspx.cs"inherits="_default"%><! DOCTYPE html>"http://www.w3.org/1999/xhtml">"Server"><meta http-equiv="Content-type"Content="text/html; Charset=utf-8"/> <script src="Js/jquery-1.7.1.min.js"></script> <title></title> <style type="Text/css">. div1 {width:100px;            height:100px; Margin-left:20px; Margin-top:20px; float: Left; Background-color:red; }    </style>"Form1"runat="Server"> <input type="Button"Value="Submit"Id=" but"/> <div style="Width:800px;height:600px;background-color:blue;"Id="boss"> <divclass="Div1"> </div> <divclass="Div1"> </div> <divclass="Div1"> </div> </div> </form></body>"Text/javascript">//object. Live Future Events$(". Div1"). Live ("Click", function () {alert ("AAA");    }); $("#but"). Click (function () {//object. Append (); add element under what object $ ("content to create in HTML")$("#boss"). Append ($ ("<div class= ' div1 ' ></div>")); });</script>

2. Prevent event bubbling by adding return false directly to the event;

Two DOM Operations

1. Operation Properties:

Get property: var s = $ ("selector"). attr ("attribute name")

Set properties: $ ("selector"). attr ("Property name", "Property value")

Delete Property: $ ("selector"). Removeattr ("attribute name")

2. Operation Style:

Action style: Get style: var s = $ ("selector"). CSS ("style name")

Set Style: $ ("picker"). CSS ("style name", "value")

The class of the action style sheet: Add Class $ ("selector"). AddClass ("Class name")

Remove the class $ ("selector"). Removeclass ("Class name")

Add remove alternating class $ ("selector"). Toggleclass ("Class name")

3. Contents of operation:

The value assignment of the form element is the same as in JS, not in the form element,. HTML Assignment: Tags compile, value: tags are removed

　　　　　　　　　　　　　　　　　　　　　　　. Text assignment: Content directly all input, value: Only take out text content

　　Form elements:

Value: var s = $ ("selector"). Val ()

Assignment: $ ("selector"). Val ("value")

　　Non-form elements:

Value: var s = $ ("selector"). html (), var s = $ ("selector"). Text ()

Assignment: $ ("selector"). HTML ("Content"), $ ("picker"). Text ("Content")

4. Operation Related elements:

Search: Parents---parent () predecessor---parents (selector)

Child---children (selector) descendants---find (selector)

Brother (brother)---prev (), Prevall (selector) Brother---next () behind an element Nextall (selector) behind the sibling element

Action: New Element $ ("HTML string")

Add: Object. Appen (jquery object)---added internally, to what object to add

After (jquery object)---Lower peer add

Before (jquery object)---upper-lateral add

Remove: Empty ()---empty all elements inside

Remove ()---Move out of the element

Copy: Clone

　　　　　　　

2017-6-3 DOM operations and events in jquery