<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DOM操作创建节点</title>
<style>
.div{
color: red;
}
</style>
<script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
window.onload = function(){
//创建元素
var div = document.createElement("div");
document.body.appendChild(div);
//创建文本
var txt = document.createTextNode("MYDOM");
div.appendChild(txt);
document.body.appendChild(div);
// 创建属性
div.setAttribute("class","div");
}
// $(function(){
//创建元素
// var $div = $("<div></div>");
// $("body").append($div);
//创建文本
// var $div = $("<div>MYDOM</div>");
// $("body").append($div);
//创建属性
// var $div = $("<div class='div'>MYDOM</div>");
// $("body").append($div);
// });
// 注意:jQuery监护了web开发的难度和门槛,但由于jQuery是对JavaScript进行封装,执行速度并未得到优化,相反影响了执行效率,为提高效率,建议混合使用
</script>
</head>
<body>
</body>
</html>
DOM操作创建节点
最新推荐文章于 2022-08-08 22:29:46 发布