DOM(二) 判断节点包含关系
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var div = document.createElement("div");
function isElement(obj) {
if (obj && obj.nodeType == 1) {
if (window.Node && obj instanceof Node) {
return true;
} try {
div.appendChild(obj);
div.removeChild(obj);
} catch (e) {
return false;
}
return true;
}
return false;
} var nodeA = {
nodeType: 1
}; //属性法是很容易攻破的 函数法是不容易被攻破的
//XML与html对象均支持createElement()方法,通过比较创建的元素时传入参数的【大小写】不同的情况下,
// 元素的nodeName是否相同来判断是哪一种文档对象。如果nodeName相同则为html对象,反之为XML对象。
var isXML = function (doc) {
return doc.createElement("p").nodeName != doc.createElement("P").nodeName;
}; var isHTMLElement = function (el) {
if (isElement(el)) {
return isXML(el.ownerDocument);
}
return false;
};
</script>
</head>
<body>
<div id="containerDiv">
<div id="childDiv">childDiv</div>
</div>
<script type="text/javascript">
var containerDiv=document.getElementById("containerDiv");
var childDiv=document.getElementById("childDiv");
var childTextDiv=childDiv.childNodes[0];
//必须是元素节点
console.log(containerDiv.contains(childDiv));
console.log(childDiv.contains(childTextDiv));
console.log(document.contains(childDiv)); //IE 下可能有问题 function fixContains(a, b) {
try {
while ((b = b.parentNode)){
if (b === a){
return true;
}
}
return false;
} catch (e) {
return false;
}
}
</script>
</body>
</html>
DOM(二) 判断节点包含关系的更多相关文章
- HTML DOM(二):节点的增删改查
上一篇讲述了DOM的基本知识,从其得知,在DOM眼中,HTML的每个成分都可以看作是节点(文档节点.元素节点.文本节点.属性节点.注释节点,其中,属性节点是属于元素节点),本篇的内容就是通过DOM对这 ...
- javascript判断节点是否在dom
在项目中碰到同事写的一段代码: //焦点必须在实时dom树中 if (ele && typeof this.document.contains === "function&q ...
- javascript系列之DOM(二)
原文:javascript系列之DOM(二) 原生DOM扩展 我们接着第一部分来说,上文提到了两种常规的DOM操作:创建文档片段和遍历元素节点.我们知道那些雨后春笋般的库,有很大一部分工作就是提供了一 ...
- 用Shell判断字符串包含关系的方法小结
这篇文章主要给大家介绍了关于用Shell判断字符串包含关系的几种方法,其中包括利用grep查找.利用字符串运算符.利用通配符.利用case in 语句以及利用替换等方法,每个方法都给出了详细的示例代 ...
- dom操作------创建节点/插入节点
<section> <div id="box" style="position: relative;"> <p id=" ...
- JS 判断节点类型
节点类型的分类 节点类型 说明 值 元素节点 每一个HTML标签都是一个元素节点,如 <div> . <p>.<ul>等 1 属性节点 元素节点(HTML标签)的属 ...
- Dom 获取、Dom动态创建节点
一.Dom获取 1.全称:Document Object Model 文档对象模型 2.我们常用的节点类型 元素(标签)节点.文本节点.属性节点(也就是标签里的属性). 3.docum ...
- DOM中元素节点、属性节点、文本节点的理解
DOM中元素节点.属性节点.文本节点的理解 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) ...
- javascript之DOM(一节点类型Node)
DOM(Document Object Model)是针对HTML和XML文档的一个API.DOM描述的是一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.起源于DHML,现为W3C的推 ...
随机推荐
- react.js 从零开始(六)Reconciliation
Reconciliation React 的关键设计目标是使 API 看起来就像每一次有数据更新的时候,整个应用重新渲染了一样.这就极大地简化了应用的编写,但是同时使 React 易于驾驭,也是一 ...
- Python入门教程 超详细1小时学会Python(转)
假设我们有这么一项任务:简单测试局域网中的电脑是否连通.这些电脑的ip范围从192.168.0.101到192.168.0.200. 思路:用shell编程.(Linux通常是bash而Windows ...
- FMDB与GCD
郝萌主倾心贡献.尊重作者的劳动成果,请勿转载. 假设文章对您有所帮助,欢迎给作者捐赠.支持郝萌主,捐赠数额任意,重在心意^_^ 我要捐赠: 点击捐赠 Cocos2d-X源代码下载:点我传送 因为FMD ...
- HDU - 1394 Minimum Inversion Number (线段树求逆序数)
Description The inversion number of a given number sequence a1, a2, ..., an is the number of pairs ( ...
- Nutch之简介与安装
初学Nutch之简介与安装 初学Nutch之简介与安装 1.Nutch简介 Nutch是一个由Java实 现的,开放源代码(open-source)的web搜索引擎.主要用于收集网页数据,然后对其 ...
- Linux报too many open files的解决方案
今天系统中有一台服务器出现异常,有时连简单的shell命令都无法执行,各种奇怪的报错,有的时候又可以成功执行 如: -bash: error while loading shared librarie ...
- cocos2d-x多分辨率和随后的自适应CCListView的bug修复
cocos2d-x多分辨率自适配及因此导致的CCListView的bug修复 cocos2d-x是一款众所周知的跨平台的游戏开发引擎.因为其跨平台的特性.多分辨率支持也自然就有其需求. 因此.在某一次 ...
- 传智播客.Net培训就业班入学测试题
2.对学员的结业考试成绩评测,要求在控制台中提示用户输入学员考试成绩,写一个方法,根据用户输入的成绩,返回一个等级:90分以上A级.80~90分B级.70~80分C级.60~70分B级.60分以下C级 ...
- Linq to Sql : 三种事务处理方式
原文:Linq to Sql : 三种事务处理方式 Linq to SQL支持三种事务处理模型:显式本地事务.显式可分发事务.隐式事务.(from MSDN: 事务 (LINQ to SQL)).M ...
- jq toggle1.9版本后不支持解决方案
<script type="text/javascript"> $(document).ready(function(){ $("button"). ...