contain与compareDocumentPosition
contain方法由IE创建,用于判断元素之间是否是父亲与后代的关系,例如:如果A元素包含B元素,则返回true,否则,返回false
eg:
<div id= "a">
<div id= "b"></div>
</div>
var a= document.getElementById("a");
var b= document.getElementById("b");
console.log(a.contains(b)); //true
值得注意的是这个方法得到了大多数浏览器的支持,除了IE的死对头Firefox,这里我们介绍另一种函数compareDocumentPosition(),即对比文档元素之间的位置
a在b的前面 4
a在b的后面 2
a包含b 20
b包含a 10
a与b相同 0
(这些结论由本人亲测获得,与w3c教程上的返回值不完全相同)
compareDocumentPosition得到了所有浏览器的支持(IE9+)
由此得出兼容性方案
if(!!window.find){
HTMLElement.prototype.contains = function(B){
return this.compareDocumentPosition(B) - 19 > 0
}
}
contain与compareDocumentPosition的更多相关文章
- contains与compareDocumentPosition
Sizzle中有一个contains方法(jQuery.contains),用来遍历是否包含指定的元素 IE率先引入一个contains()方法,可以在节点中查找某一个节点是不是当前节点的厚点,如果 ...
- 使用compareDocumentPosition比较两个元素在文档中的位置
PS:尊重原创,转载请注明来自http://www.cnblogs.com/Raoh/p/js_compareDocumentPosition_between_two_node.html 使用comp ...
- contains 和 ele.compareDocumentPosition确定html节点间的关系
~~~ nodeA.contains(nodeB) //ie , nodeA.compareDocumentPosition(nodeB) //firefox opera 1.DOMElement ...
- javascript中的contains方法和compareDocumentPosition方法
IE有许多好用的方法,后来都被其他浏览器抄袭了,比如这个contains方法.如果A元素包含B元素,则返回true,否则false.唯一不支持这个方法的是IE的死对头firefox.不过火狐支持com ...
- DOM、BOM 操作超级集合
本章内容: 定义 节点类型 节点关系 选择器 样式操作方法style 表格操作方法 表单操作方法 元素节点ELEMENT 属性节点attributes 文本节点TEXT 文档节点 Document 位 ...
- jQuery-1.9.1源码分析系列(三) Sizzle选择器引擎——编译原理
这一节要分析的东东比较复杂,篇幅会比较大,也不知道我描述后能不能让人看明白.这部分的源码我第一次看的时候也比较吃力,现在重头看一遍,再分析一遍,看能否查缺补漏. 看这一部分的源码需要有一个完整的概念后 ...
- 深入理解DOM节点关系
× 目录 [1]父级属性 [2]子级属性 [3]同级属性[4]包含方法[5]关系方法 前面的话 DOM可以将任何HTML描绘成一个由多层节点构成的结构.节点分为12种不同类型,每种类型分别表示文档中不 ...
- Web javascript 中常用API合集
来源于:https://www.kancloud.cn/dennis/tgjavascript/241852 一.节点 1.1 节点属性 Node.nodeName //返回节点名称,只读 Node. ...
- DOM(文档对象模型)
1.定义: DOM是Document Object Model文档对象模型的缩写.是针对HTML和XML文档的一个API,通过DOM可以去改变文档. 例如:我们有一段HTML,那么如何访问第二层第一个 ...
随机推荐
- VC++ 带界面的ActiveX控件
一.新建MFC ActiveX工程OleHasInterface: 二.新建一个对话框资源,ID为 IDD_FORMVIEW,关联类CActXInterfaceDlg,基类CDialog: 三.设计对 ...
- python 的时间复杂度
Python内置方法的时间复杂度 本文翻译自Python Wiki 本文基于GPL v2协议,转载请保留此协议. 本页面涵盖了Python中若干方法的时间复杂度(或者叫“大欧”,“Big O”).该时 ...
- android应用安全——组件通信安全(Intent)
这里主要涉及到了Activity.Content Provider.Service.Broadcast Receiver等.这些如果在Androidmanifest.xml配置不当,会被其他应用调用, ...
- Volley使用详细说明
前一篇粗略的介绍了一下Volley,并在最后附上了一段使用代码,这一篇详细的介绍一下Volley的使用.前面也说了Volley主要获取JSON对象和图片加载,这里也分为两部分介绍. 1.获取JSON对 ...
- hdu4691(后缀数组)
算是后缀数组的入门题吧. 思路无比简单,要是直接套模板的话应该很容易秒掉. 关于后缀数组看高中神犇的论文就可以学会了 算法合集之<后缀数组——处理字符串的有力工具> 话说这题暴力是可以过了 ...
- hdu3729(二分图)
比赛的时候没有想到二分图,一直在想dp和贪心. 原因是因为看到数据是100000所以直接就没有往二分图匹配上想. 现在想想. 因为二分图两边的太不对称了,60 和100000 , 如果用匈牙利算法考虑 ...
- fnt 图字原理
摘自:http://blog.csdn.net/wzq9706/article/details/8188256 首先要介绍一下,图字是怎么来的?其实这个很早很早了,记得80后在95年开始玩DOS下的仙 ...
- Android自定义上拉控件SpringView
Demo 先看一下SpringView的效果图: 1.拖动灰色部分可拖动下方视图,点击jump按钮可让下方视图自行滑动. 使用方法 布局文件: <com.zql.android.springvi ...
- delphi ----处理SQL server主键自增,并给定值
获取一个表中最大的值. function GetNEWID(tablename: string): string; begin Result:=''; with DMW_Public.DQ_Pub d ...
- Scala 常用语法
Clojure首先是FP, 但是由于基于JVM, 所以不得已需要做出一些妥协, 包含一些OO的编程方式 Scala首先是OO, Java语法过于冗余, 一种比较平庸的语言, Scala首先做的是简化, ...