Nearth===>WEB前端--第24课/JQuery/动态清空元素以及复制元素6（empty(),clone(),append()）

最新推荐文章于 2020-05-06 19:32:27 发布

码字界陈冠希

最新推荐文章于 2020-05-06 19:32:27 发布

阅读量243

点赞数

分类专栏： WEB前端第三季/JQuery

本文链接：https://blog.csdn.net/ly1716/article/details/103096630

版权

WEB前端第三季/JQuery 专栏收录该内容

52 篇文章 0 订阅

订阅专栏

小提示：这个代码可以帮助我们学习如何清空数据以及复制数据···········

代码学习：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        * {
            padding: 0;
            margin: 0;
        }
		body{
					 background-image: url(0.jpg);
					 background-repeat: no-repeat;
					 background-attachment: fixed;
					 background-size: 100% 100%;
		} 
		div{
			width: 200px;
			height: 200px;
			background-color: red;
			margin-top: 20px;
		}
    </style>
    <script src="jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script>
      $(function(){
		  $("#btn1").click(function(){
			 $("#dv").html("");//清空元素中的内容
			 /* $("#dv").empty();//清空元素中内容 */
			 /* $("#dv").remove();//移除元素自身--自杀 */
		  });
		  $("#btn2").click(function(){
			  var spanObj=$("#dv>span").clone();//克隆,复制了这个元素
			  spanObj.css("fontSize","12px");
			  $("#dv2").append(spanObj);
		  });
	  });
    </script>
</head>
<body>
<h1>删除数据以及复制数据的方法学习(html(""),empty().remove(),clone(),append())</h1>
<hr >
<input type="button" name="" id="btn1" value="显示效果" />
<input type="button" name="" id="btn2" value="显示效果" />
<hr >
<div id="dv">
	<span>今天天气真好啊·····一起聊会儿····</span>
</div>
<div id="dv2"></div>
</body>
</html>

趁年轻，多多折腾自己的青春·························

码字界陈冠希

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
Nearth===>WEB前端--第24课/JQuery/动态清空元素以及复制元素6（empty(),clone(),append()）

小提示：这个代码可以帮助我们学习如何清空数据以及复制数据···········代码学习：<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> *...
复制链接

扫一扫