Summary of Methods of Operating DOM with jQuery

1. DOM operations are divided into three categories

1.DOM Core

DOM Core is not exclusive to Javascript and can be used by any programming language that supports DOM. Its use is not limited to dealing with a document written in a markup language

2.HTML-DOM

Previous to DOM Core, it provides a more concise tag to describe the various element attributes of HTML-DOM

3.CSS-DOM

CSS-DOM does not operate on CSS. In JavaScript, as long as the function is to obtain and set various attributes of style objects,

2. Style manipulation

1. Set style values directly

css(name,value)  // Setting a single property 
css({name:value,name:value,name:value....})  // Colleagues set multiple properties 

2. Append and Remove Styles

addClass(class) // Append style 
removeClass(class)  // Remove Style 

3. Switch styles

taggleClass()    //可以切换不同元素的类样式

3. Class capacity operation

1. html code operation

html([content])  //可选,规定备选元素的新类容,该参数可以包含HTML标签,无参数时,表示被选元素的文本类容

2. Label class capacity operation

text([content])  //可选,规定被选元素的新文本类容.  注释,特殊字符会被编码.无参数时,表示获取元素的被选类容

3. Property value action

val([value])   

4. Node property action

1. Find nodes

$("xxx")

2. Create a node

$(selector) // Selector 
$(element) //Dom Element 
$(html)    //html Code 

3. Insert a node

Internal insert: append (content) appendTo (content) prepend (content) prependTo (content)

External insertion: after (content) insertAfter (content) before (content) insertBefore (content)

4. Delete a node

$(selector).remove([expr])

5. Replace nodes

$("ul li:eq(1)").replaceWith($xxx)

6. Copy nodes

$(selector).clone([includeEvents])