Mr.J-- jQuery学习笔记(二十七)--DOM操作方法(删除&获取文本)

最新推荐文章于 2023-11-11 23:41:09 发布

End_less__

最新推荐文章于 2023-11-11 23:41:09 发布

阅读量340

点赞数

分类专栏： jQuery学习

本文链接：https://blog.csdn.net/Ms_yjk/article/details/94171315

版权

jQuery学习专栏收录该内容

33 篇文章 3 订阅

订阅专栏

清除

<body>
<button>调用remove</button>
<div>
    我是div
    <p>我是段落</p>
</div>
<div class="box">
    我是div
    <p>我是段落</p>
</div>
<p class="box"></p>
</body>

empty ==> 清空指定元素中的所有内容

var btn = document.getElementsByTagName("button")[0];
btn.onclick = function () {
	 $("div").empty();
	 console.log($("div").empty());
}

点击按钮调用方法后：

remove ==> 删除所有的元素或指定元素

清除所有元素：

var btn = document.getElementsByTagName("button")[0];
btn.onclick = function () {
	$("div").remove();
	console.log($("div").remove());
}

与empty方法输出结果不同。length不一样。

清除指定元素：

$("div").remove(".box");

获取内容

<body>
<button>调用text</button>
<div>
    我是div1
    <p>我是段落1</p>
</div>
<div class="box">
    我是div2
    <p>我是段落2</p>
</div>
</body>

html ==> 设置所有元素的内容，获取第一个元素的内容

var btn = document.getElementsByTagName("button")[0];
btn.onclick = function () {
	var $div = $("div");
	 console.log($div.html());
}

进行页面更改之后：

$div.html("123");

同样的元素也可以进行设置：

$div.html("<div><span>我是span</span></div>");

text ==> 设置所有元素的文本内容，获取所有元素的文本内容

var btn = document.getElementsByTagName("button")[0];
btn.onclick = function () {
	var $div = $("div");

	console.log($div.text());
}

同样也可以进行页面文本内容的更改：

$div.text("123");
$div.text("<div><span>我是span</span></div>");

或者使用get(Mr.J-- jQuery学习笔记(二十六)--jQuery原型上的属性&&方法):

console.log($div.get(0).innerText);

End_less__

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Mr.J-- jQuery学习笔记(二十七)--DOM操作方法(删除&获取文本)

清除<body><button>调用remove</button><div> 我是div <p>我是段落</p></div><div class="box"> 我是div <p>我是段落</p></div><p ...
复制链接

扫一扫