假設頁面上有一些元素如下:
"box"
>
1<
/p>
2<
/p>
3<
/p>
<
/div>
"box"
>
<
/div>
"box"
>
<
/div>
"box"
>
<
/div>
"box"
>
<
/div>
<
/body>
引入外部的jquery資源:
"../jquery.js"
>
<
/script>
1.建立元素:
2.插入元素:
// $("#box")被div插入了
$("#box").
(div)
;// 把div插入到$("#box")中,這裡的效果與上面的效果一樣
div.
($("#box"))
;// prepend:插入指定父元素的第乙個子元素
$("#box").
prepend
(div)
; div.
prependto
($("#box"))
;// before:給指定元素,在上面新增乙個兄弟
$("#box").
before
(div)
;// after:給指定元素,在下面新增乙個兄弟
$("#box").
after
(div)
;3.元素的刪除:
// 刪除指定元素
$(".box").
remove()
;// 刪除所有子元素
$("#box").
empty()
;
4.元素的修改(替換元素):
// 獲取標籤自身同時刪除自己
var s = $(
"#box").
replacewith()
; console.
log(s)
;// 傳字元的引數,會修改標籤
$("#box").
replacewith
("+ $(
"#box").
attr
("id")+
"'>"
+ $(
"#box").
html()
+"");
5.元素的轉殖:
$(
"#box").
click
(function()
)// 只轉殖結構
var b = $(
"#box").
clone()
; $(
"body").
(b);
// 除了轉殖結構,還會轉殖事件
var b = $(
"#box").
clone
(true);
$("body").
(b);
注意:上述的每個方法中又有不同的情況,在使用這些方法時,根據需求選擇合適的情況 JQuery 操作DOM元素
使用attr 方法控制元素的屬性 使用attr 屬性名 是獲取該屬性的值。使用attr 屬性名 屬性值 是設定屬性的值 html text 方法控制元素的文字 包含樣式 使用html 時是獲取元素的html文字 包括樣式 如果文字是斜體的,獲取到的也是斜體的 使用html 哈哈哈 時是將元素的htm...
jQuery 訪問DOM元素操作
一 操作元素屬性 1.獲取元素的屬性 attr prop 例1 css樣式 使用如下 attr可以獲取其width input type button attr width 200px console.log input type button attr width 200px prop不可以獲取其...
jquery操作DOM 元素 3
detach 從dom 中去掉所匹配的元素。detach selector selector 乙個選擇表示式將需要移除的從匹配的元素中過濾出來。p detach empty 從dom中移除集合中匹配元素的所有子節點。empty 這個方法不接受任何引數。結構 hello goodbye hello e...