JQ對HTML元素 節點操作大全

2021-09-29 03:17:16 字數 1852 閱讀 5277

//html

元素

1、元素隱藏

$(".class").hide();
2、元素展示

$(".class").show();
3、修改css的屬性

$(".class").css("color","red");
addclass(),新增 class 屬性。

$

("button").

click

(function()

);

4、修改css樣式

addclass(class)

removeclass(class)

toggleclass(class):若有這個class類就刪除,若無就新增

5、文字內容的操作

$div = $(『div』) //獲取div元素  

console.log($div.text()) //獲取文字內容

$div.text(「aaaaa」) //設定了文字的內容

6、對於dom節點的操作

a. 建立元素節點:

var $jsp = $(「

」)

//建立了乙個p節點插入到div裡面

b、替換節點

replaceall

(seletor)

:用於使所有的元素替換掉seletor匹配的元素示例:

$(「good<

/div>」)

.replaceall

(「div」)

replacewith

(content)

:用匹配的元素替換掉指定的html元素示例:

$(「#box1」)

.replacewith

(「sunck<

/div>」)

c、remove() 方法刪除被選元素及其子元素。

$

("button").

click

(function()

);

7、slideup() 方法用於向上滑動元素

$

("#flip").

click

(function()

);

8、animate() - 操作多個屬性

$

("div").

animate()

;

也可以定義相對值(該值相對於元素的當前值)。需要在值的前面加上 += 或 -=:

$

("div").

animate()

;

9、width() 方法設定或返回元素的寬度(不包括內邊距、邊框或外邊距)。

height() 方法設定或返回元素的高度(不包括內邊距、邊框或外邊距)。

"div1" style="height:

100px;width:

300px;padding:

10px;margin:

3px;border:

1px

solid blue;background-color:lightblue;">

<

/div>$(

"button").

click

(function()

);

jQ節點操作

doctype html en utf 8 viewport content width device width,initial scale 1.0 document title jquery 1.10.1.min.js script 注 以下所有的方法,都可以傳參,引數部分,都是css選擇器,可...

jQuery對元素 節點的操作

一 文字內容的操作 方法 text text val 例子 div div 獲取 div元素 console.log div.text 獲取文字內容 div.text aaaaa 設定了文字的內容 二 html內容的操作 html 用於獲取第乙個匹配元素的 html 內容 html val 用於設定...

jq刪除元素操作

jquery提供了多個方法進行元素的刪除操作,目前用到了remove empty 1.remove 是刪除指定的元素全部內容,例如 this parentnode remove 刪除按鈕的父節點 但除了這個元素本身得以保留之外,remove 不會保留元素的 jquery 資料。其他的比如繫結的事件 ...