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/ ...
随机推荐
-
React Native + Nodejs 使用RSA加密登录
想用rn做个RSA(非对称加密)登录 基本流程就是在服务端生成RSA后,将“公钥”发到客户端,然后客户端用“公钥”加密信息发送到服务端,服务务端用私钥解密. 过程不复杂,问题在于,nodejs和rn都 ...
-
Atitit ACID解决方案2PC(两阶段提交)&#160;&#160;跨越多个数据库实例的ACID保证
Atitit ACID解决方案2PC(两阶段提交) 跨越多个数据库实例的ACID保证 1.1. ACID解决方案1 1.2. 数据库厂商在很久以前就认识到数据库分区的必要性,并引入了一种称为2PC( ...
-
JXLS 双循环模板
商户名称 门店代码 时间 金额 <jx:forEach items="${resultList}" var="l"> ${l.name} ...
-
Hashtable与ConcurrentHashMap区别
Hashtable与ConcurrentHashMap区别 ConcurrentHashMap融合了hashtable和hashmap二者的优势. hashtable是做了同步的,是线性安全的,(2) ...
-
Ubuntu 14.04 安装flash插件
分别tar.gz和apt-get方法 第一种: adboe官网下载tar.gz,进入terminal 1.解压缩包,输入命令“tar -zxvf 软件包名字” 2.拷贝插件到mozilla目录,输入命 ...
-
LayoutInflater的获取与使用
在实际开发中LayoutInflater这个类还是非常有用的,它的作用类似于findViewById().不同点是LayoutInflater是用来找res/layout/下的xml布局文件,并且实例 ...
-
Java DB 访问之 mybatis mapper xml 配置方式
1 项目说明 项目采用 maven 组织 ,jdbc 唯一的依赖就是 mysql-connector-java pom 依赖如下: mysql 数据连接 : mysql-connector-java ...
-
Visual Studio Code扩展:
Auto Close TagAuto Rename TagBeautifyChinese (Simplified) Language Pack for Visual Studio CodeClass ...
-
jQuery 选择器demo练习
<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8" ...
-
Git忽略规则.gitignore忽略node_modules文件夹
在项目文件夹里添加.gitignore的文件 打开文件,在里面添加 /node_modules