js 获得某节点的子节点，已知该子节点为div
<divclass="out"onmouseover="show(this)"><a>.....</a><h1>......</h1><divclass="btn">.....
<div class="out" onmouseover="show(this)">
<a>.....</a>
<h1>......</h1>
<div class="btn">......</div>
</div>
如上，我想通过class为out的div获得class为btn的子元素div，鼠标划过父div获取，划过时调用show(it){....}这个function，函数体内通过it获取父节点并执行相关代码
如果是jquery的话，直接$(".out").mouseover(function(){.......})就行，但是因为这个整个div是页面加载后由js生成，所以无法用jquery绑定
而用js获取的话
show(it){
it.children.......//会导致不同的浏览器不兼容
}
我就想知道js怎么写能有类似jquery的$(".out").find(".btn")的功能
想要实现的功能是鼠标划过out-div，显示btn-div，鼠标移开，则btn-div隐藏 展开
<a>.....</a>
<h1>......</h1>
<div class="btn">......</div>
</div>
如上，我想通过class为out的div获得class为btn的子元素div，鼠标划过父div获取，划过时调用show(it){....}这个function，函数体内通过it获取父节点并执行相关代码
如果是jquery的话，直接$(".out").mouseover(function(){.......})就行，但是因为这个整个div是页面加载后由js生成，所以无法用jquery绑定
而用js获取的话
show(it){
it.children.......//会导致不同的浏览器不兼容
}
我就想知道js怎么写能有类似jquery的$(".out").find(".btn")的功能
想要实现的功能是鼠标划过out-div，显示btn-div，鼠标移开，则btn-div隐藏 展开
2个回答
展开全部
我试过了，有作用的，你要么就委派事件，如果还不可以的话，delegate知道吧？？？
<!DOCTYPE HTML>
<html>
<head>
<meta charset=UTF-8>
<meta name="keywords" content="白菜编辑部">
<title>白菜编辑部</title>
<style type="text/css">
</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
jQuery (function ($)
{
$ ('body').append ('<div class="out"><a>.....</a><h1>......</h1><div class="btn">btnbtnbtn</div></div>');
$ ('div.out').mouseover (function ()
{
$ ('.btn').show ();
}).mouseout (function ()
{
$ ('.btn').hide ();
});
});
</script>
</head>
<body>
</body>
</html>
追问
这样是可以的。不过我还想问一下，document.getElementsByClassName("btn");可以获取到页面中的id=abc的元素，可是如果这里写it.getElementsByClassName("btn");就不行。即使是获取ID，如document.getElementById("btn");可以，但是it.getElementById("btn");就不行？
追答
getElementsByClassName 这个方法对于某些浏览器是不兼容的，最好不要用这个
你可以用jquery的啊，你又不是不许用jquery，你提问已经透露了你使用jquery了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
