<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<div id="cotent">
<div>我的主页</div>
<div>聆听我的</div>
<div>私人领地</div>
</div>
<script type="text/javascript">
//js
var mydiv2=document.getElementById("cotent").getElementsByTagName("div");//捕获#cotent的直接子元素div>子子元素div>...（相当于JQ的find）
console.log(mydiv2.innerHTML);//【undefined】子元素的内容-->会报错因为是个集合，如果需要全显示需要遍历，单个用[]指定
mydiv2.style.color="red";//【Uncaught TypeError: Cannot set property ‘color‘ of undefined】子元素设置样式-->会报错因为是个集合，如果需要全设置需要遍历
//jq
var mydiv1=$("#cotent").children("div");//捕获#cotent的直接子元素（而find则会捕获#content直接子元素div>子子元素div>...）
console.log(mydiv1.html());//【我的主页】子元素的内容-->会显示第一个，如需要全显示需要遍历，单个用eq指定（不符合情理）。本来jQuery如果也这么写，就会报错，所以为了不报错，就返回第一个了
mydiv1.css({"color":"red"});//【字都变红】子元素设置样式-->会作用到所有子元素，无需便利（不符合情理）
</script>
</body>
</html>
时间： 2024-10-13 23:28:33