First, jquery operation Dom-query
HTML operations
-HTML (): Reads or modifies the HTML content of a node, similar to the innerHTML property in JavaScript
650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M01/7E/6C/wKiom1b-X2yxgKrTAABY4VoUGQs797.png "title=" Web.png "alt=" Wkiom1b-x2yxgkrtaaby4vougqs797.png "/>
Text manipulation
-Text (): Reads or modifies the text content of the node, similar to the Textcontent property in JavaScript
650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M01/7E/69/wKioL1b-YGzQICpsAABO-so1N_k641.png "title=" Web.png "alt=" Wkiol1b-ygzqicpsaabo-so1n_k641.png "/>
Value action
-Val (): Reads or modifies the value of a node, similar to value in JavaScript
650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M02/7E/6C/wKiom1b-YAbx_29iAABQJdCR9w0774.png "title=" Web.png "alt=" Wkiom1b-yabx_29iaabqjdcr9w0774.png "/>
Property manipulation
-attr (): Read or modify the properties of a node
-Removeattr (): Delete the properties of the node
650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M02/7E/6C/wKiom1b-YFKytNsvAACSvJYLtm4805.png "title=" Web.png "alt=" Wkiom1b-yfkytnsvaacsvjyltm4805.png "/>
Second, jquery operation Dom-style operation
Style actions
-attr ("Class", "") Gets and sets
-AddClass ("") Append Style
-Removeclass ("") Remove style
-Removeclass () Remove all styles
-Toggleclass ("") Toggle Style
-Hasclass ("") whether there is a style
-CSS ("") to read the values of CSS
-CSS ("", "") Set multiple styles
Third, jquery operation Dom-Traversal node
Traversing nodes
-Children ()/children (selector) Only consider direct child nodes
-Next ()/next (selector) Next sibling node
-Prev ()/prev (selector) previous sibling node
-Siblings ()/siblings (selector) Other brothers
-Find (selector) finds all descendants that satisfy the selector
-Parent () parents (no selectors)
650) this.width=650; "src=" Http://s1.51cto.com/wyfs02/M00/7E/69/wKioL1b-YpjgxK51AAB75ZDqGhw499.png "title=" Web.png "alt=" Wkiol1b-ypjgxk51aab75zdqghw499.png "/>
Iv. jquery Operation Dom-Create, INSERT, delete
Creating a DOM Node
-JQuery uses the $ () factory function to create the node, passing the HTML code string to the $ () factory function
-JQuery allows the creation of element nodes, text nodes, and attribute nodes directly through HTML code strings
650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M02/7E/6C/wKiom1b-Yy2iZ_ZLAAB76XDX_qU383.png "title=" Web.png "alt=" Wkiom1b-yy2iz_zlaab76xdx_qu383.png "/>
Inserting a DOM node
-Internal Insertion Node
-Append () as the last child node added in
-prepend () added as the first child node
-External Insert Node
-After () as the next sibling node to add in
-Before () added as the previous sibling node
650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M02/7E/69/wKioL1b-ZHey_fV9AABSk5S8MOI701.png "title=" Web.png "alt=" Wkiol1b-zhey_fv9aabsk5s8moi701.png "/>
Delete DOM node
-Remove () Only consider direct child nodes
-Remove (selector) after positioning by selector
-Empty () empty node
650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M01/7E/69/wKioL1b-ZNjh-zYLAACVhpMk10U493.png "title=" Web.png "alt=" Wkiol1b-znjh-zylaacvhpmk10u493.png "/>
V. jquery Operation Dom-replace
Replace DOM node
-ReplaceWith (): Replaces all matching elements with the specified HTML or DOM element
-ReplaceAll (): Reversed ReplaceWith () method
650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M01/7E/69/wKioL1b-Y2SAOoeIAABpCAuM6AY233.png "title=" Web.png "alt=" Wkiol1b-y2saooeiaabpcaum6ay233.png "/>
Vi. jquery Operation Dom-replication
Copy DOM Nodes
-Clone ()
-Clone (TRUE): The replicated node also has behavior (event handling)
650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M01/7E/69/wKioL1b-YwShUHZwAACGEn32Tk0536.png "title=" Web.png "alt=" Wkiol1b-ywshuhzwaacgen32tk0536.png "/>
Summary: This chapter mainly describes the jquery operation Dom (query, style operations, traverse nodes, create insert Delete, replace, copy)
This article from the "Flying Ants" blog, declined to reprint!
JavaScript jQuery-3 jquery operation Dom (query, style action, traverse node, create insert Delete, replace, copy)