如何判断一个元素A包含了元素B呢?若是不用contains方法的话,如何作呢?
腾讯面试的时候也出了这道题啊,当时没看dom的知识,因此一抹黑哦。。。
那就判断B是否为A的child喽,那也就是A是B的parent或者parent.parent或者parentNode.parentNode.parentNode....
因此就这样向上遍历一下B的父亲节点,看A是否是在这个父节点链上。代码以下:
function isAContainsB(B,A){
var node = B.parnetNode;
do{
if(node==A){
return true;
}else{
node=node.parentNode;
}
}while(node!==null);
return false;
}
ClassList属性又是啥?
原生的ClassName属性是个字符串,若是你要给一个元素设置一个class呢,就要这么写:
element.className="class1"
那若是想再给这个元素增长一个类,就要这么写了:
element.className="class1 class2"
再对这个类进行一些操做,好比判断是否是包含class1(className.indexOf("class1")>=0),等等,
都要操做这个className的字符串,很麻烦哦。
那DOM就发展有了classList这个属性,这个属性是个集合类型DOMTokenList的实例,
有length属性也能够经过item()访问(这句话是摘抄。)最有用的是它提供了几个方法:
add,contains,remove,toggle
想必你们都猜到怎么用了吧,下面举例来讲明下:
1.一个元素有个类class1,我又想给它加个class2
element.classList.add("class2")
当这个元素已经有了class2,再add的话,会忽略,就不会再添加了。
2.判断是否已经有了某个类
element.contains("class2")
判断是否有了class2这个类了,若是有就返回true,反之返回false。
3.移除一个已有的类
element.remove("class2");
4.toggle,交替增长或移除某个类, 好比我有个element,若是它没有class2这个类,那么我toggle一下:
element.toggle("class2")
那么这个element.contains("class2")就返回true了,那么这时我再:
element.toggle("class2")
那么这个element.contains("class2")就返回false了。就这么交替下去。
好了,今天就写这么多吧。