<!DOCTYPE html>
<html>
<head>
<title>test3.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../js/jquery-3.3.1.js"></script>
<script type="text/javascript">
$(function(){
//插入子节点：append,appendTo,prepend,prependTo
var newNode = $("<li>千与千寻</li>");
//$("ul").append(newNode);
//newNode.appendTo($("ul"));
//$("ul").prepend(newNode);
//newNode.prependTo($("ul"));
//插入同辈节点：after,insertAfter,before,insertBefore
//$("ul").after(newNode);
//$(newNode).insertAfter($("ul"));
//$("ul").before($(newNode));
//$(newNode).insertBefore($("ul"));
//替换节点：replaceWith,replaceAll
//$("ul li:eq(1)").replaceWith($(newNode));
//$("ul li:eq(1)").replaceWith($(newNode));
//$("ul li").replaceWith($(newNode));
//复制节点：clone
//$("ul li:eq(1)").clone(true).appendTo("ul");
//删除节点：remove(删除的是引用),detach,empty
/* $("ul li:eq(1)").click(function(){
var $li = ("ul li:eq(1)").remove();
$li.appendTo("ul");
}); */
//$("ul li:eq(1)").detach();
//$("ul li:eq(1)").empty();
//获取与设置节点属性attr(),removeAttr()
//$("img").attr({width:"100px",heigth:"100px"});
alert($("img").removeAttr("name"));
});
</script>
</head>
<body>
<p>热门动画</p>
<ul>
<li>海贼王</li>
<li>死神</li>
<li>柯南</li>
</ul>
<img src="../images/6.jpg" name="this is a picture" >
</body>
</html><!DOCTYPE html>
<html>
<head>
<title>test4.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../js/jquery-3.3.1.js"></script>
<script type="text/javascript">
$(function(){
//获得所有元素的子元素
//$("body").css({background:"red"});
//遍历所有子元素：next([expr]),prev([expr]),slibings([expr])
//下一个同辈元素
//$("#div3").next().css({background:"red"});
//前一个同辈元素
//$("#div4").prev().css({background:"red"});
//前面和后面的同辈元素
//$("#div4").slibings().css({background:"red"});
//遍历前辈元素：parent(父辈元素),parents(祖先元素)
//$("#div4").parent().css({background:"red"});
//$("#div4").parents().css({background:"red"});
});
</script>
</head>
<body>
<div >
<div >
<div ></div>
<div ></div>
<div ></div>
</div>
<br>
<div >
<div ></div>
</div>
</div>
</body>
</html>