javascript判断一个元素是另外一个元素的子元素
javascript判断一个元素是另外一个元素的子元素用途有很多,最常用的就是当点击页面的空白处去执行某些操作,比如弹出层等。
function isParent (obj,parentObj){
while (obj != undefined && obj != null && obj.tagName.toUpperCase() != ‘BODY’){
if (obj == parentObj){
return true;
}
obj = obj.parentNode;
}
return false;
} $(document).click(function(event){
alert(isParent(event.target, $(“.floatLayer”)[0]));
});
感觉还挺好用,但是在jQuery应用中还是有很多缺陷,比如多个元素的时候写起来就不是很方便。所以写了比较简单的jQuery判断一个元素是否为另一个元素的子元素(或者其本身)的两个扩展:
jquery代码
//判断:当前元素是否是被筛选元素的子元素
jQuery.fn.isChildOf = function(b){
return (this.parents(b).length > 0);
};
//判断:当前元素是否是被筛选元素的子元素或者本身
jQuery.fn.isChildAndSelfOf = function(b){
return (this.closest(b).length > 0);
};
使用起来也非常方便:
$(document).click(function(event){
alert($(event.target).isChildOf(“.floatLayer”));
});
或者
$(document).click(function(event){
alert($(event.target).isChildAndSelfOf (“.floatLayer”));
});
javascript判断一个元素是另外一个元素的子元素的更多相关文章
- js将数组中一个或多个字段相同的子元素中合并
最近js中遇到js将数组中一个或多个字段相同的子元素中合并,相信很多朋友也有遇到,大家可能有多种方法,我在这里记录一个相对简单的方法,当然大家如有其它更好的方法,请提出来大家共同学习. //将经济事项 ...
- 父元素高度设置为min-height,子元素高度设置为100%,但实际上子元素高度你知道是多少吗?
前言 给父元素一个min-height,子元素设置height:100%. 代码 <!DOCTYPE html> <html> <head> <title&g ...
- 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后,子元素不随着滚动条滚动的问题
解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题 在IE6,IE7下,子元素使用position:relati ...
- 解决 border-radius 元素在应用了 transform 的子元素 时overflow:hidden 失效的问题
受大家启迪,于是最近深入研究了一下Css3中的一些属性.之中也是碰到了个不为我知的问题,在这里特此总结并与大家分享. 问题重现:在父元素上应用了 border-radius 的圆角属性.加上 ove ...
- CSS子元素居中(父元素宽高已知,子元素未知)
<style> .container{width:400px; height:400px; position:relative;} .center{position:absolute; l ...
- 在css中 父元素不固定高度,怎样实现子元素的高度100%
父元素使用 position: relative; 子元素使用 position: absolute; height: 100%;
- 改变父元素的透明度,不影响子元素的透明度—css
1.如果我们给父元素添加opacity:0.4后,子元素的red颜色也变成了0.4的透明度, 例子如下: <!DOCTYPE html> <html> <head> ...
- div鼠标悬停,子元素上移,鼠标移出,子元素下移动画。
HTML: <div class="edt_title" > <div id="edt_title"> <p class=&quo ...
- 父元素设置overflow,绝对定位的子元素会被隐藏或一起滚动
一般情况: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <met ...
- div高度自适应(父元素未知,所有高度跟随子元素最大的高度)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- java String拼接的方法选择及性能分析
String 拼接的方法选择 在拼接静态字符串时,尽量用 +,因为通常编译器会对此做优化,如: String test = "this " + "is " + ...
- 数学 CF1068B LCM
CF1068B LCM 给定一个正整数\(b (1\leq b \leq 10^{10})\). 把一个正整数a从1枚举到\(10^{18}\),求有多少种不同的\(\large \frac{[a,b ...
- QQ第三方登陆示例
先上图 若想实现QQ登录,需要成为QQ互联的开发者,审核通过才可实现.注册方法可参考链接http://wiki.connect.qq.com/%E6%88%90%E4%B8%BA%E5%BC%80%E ...
- [HDU4089]Activation(概率DP)
HDU4089 题意:有n个人排队等着在官网上激活游戏.Tomato排在第m个. 对于队列中的第一个人.有一下情况: 1.激活失败,留在队列中等待下一次激活(概率为p1) 2.失去连接,出队列,然后排 ...
- CDQZ Day3
模拟题 day3出题人: liu_runda题目名称 摆渡 摆车 背包源程序文件名 boat.cpp ju.cpp pack.cpp输入文件名 boat.in ju.in pack.in输出文件名 b ...
- 【Python】子域名查询脚本
脚本学习,多写写就会啦,来一发个人编写的超级无敌low的子域名查询脚本 #coding:utf-8 import re import requests import urllib import url ...
- range() 和 np.arange()区别
range() 和 np.arange()区别 range(start,stop,step) 三个参数都必须是整数 np.arange()没有此类约束
- html5实现判断拍照旋转角度等功能
https://www.aliyun.com/jiaocheng/857189.html base64图片编码上传,判断图片是否有旋转,若有旋转修正图片并保存至阿里 http://code.c ...
- (转)Linux运维MySQL必会面试题100道
老男孩教育Linux运维班MySQL必会面试题100道 (1)基础笔试命令考察 (要求:每两个同学一组,一个口头考,一个上机实战作答,每5个题为一组,完成后换位) 1.开启MySQL服务 2.检测端口 ...
- 【CSS】CSS Sprites (CSS 精灵) 技术
CSS Sprites CSS Sprites在国内很多人叫css精灵,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来,当访问该页面时,载入的图片就不 ...