<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div class="box">
<span>hello jq</span>
</div>
</body>
<script src="../jquery.js"></script>
<script>
// 创建并插入
console.log($("div"))
//
// //创建：
var d = $("<div>");
//
// //body被div插入了：
$("body").append(d);
//
// // 把div插入到body
d.appendTo($("body"));
//
$("body").prepend(d); //插到最上面。body下面的第一个
d.prependTo($("body"));//同上
$("body").before(d); //插到body的前面，同级
$("body").after(d) ; //插到body的后面
// 删除
$(".box").remove(); //删除box
$(".box").empty(); //box里面的元素设置为空
// 改
$(".box").replaceWith("<p class='"+ $(".box").attr("class") +"'>"+ $(".box").html() +"</p>"); //将box改为p标签，若想p标签里面的内容与box一样，就需要进行字符串拼接
// 查 就是选择器
</script>
</html>
JQ-DOM与元素的操作的相关教程结束。
