为什么去掉正则表达式pattern里面的括号,整个页面都变成黄色而不是报错?

来源:3-32 位置匹配之单词边界匹配

嘿曼

2018-08-18 23:08:53

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>利用正则表达式兼容ClassName获取dom</title>

</head>

<body>

<p>

<div class="odd odd1">1</div>

<div class="even">2</div>

<div class="odd">3</div>

<div class="even">4</div>

</p>

<script type="text/javascript">


var getByClassName =function(className,parentNode){

if(!document.getElementsByClassName(className)){

return document.getElementsByClassName(className);

    }else{console.log(1);

     var parentNode = parentNode || document;

     var nodeList = [];

     var pattern = new RegExp('(^|\\s+)'+className+'($|\\s+)');

     var allNodes = parentNode.getElementsByTagName('*');

     for(var i=0; i<allNodes.length; i++){

     if(pattern.test(allNodes[i].className)){

     console.log(pattern.test(allNodes[i].className));

     console.log(pattern.exec(allNodes[i].className));

     nodeList.push(allNodes[i]);

     console.log(2);

     }

     }

     return nodeList;

    }

    }

    var odd = getByClassName('odd');

    var even = getByClassName('even');

    for(var i=0; i<odd.length; i++){

     odd[i].style.backgroundColor = 'red';

    }

    for(var i=0; i<even.length; i++){

     even[i].style.backgroundColor = 'yellow';

    }

</script>

</body>

</html>

为什么去掉正则表达式pattern里面的括号,整个页面都变成黄色而不是报错?

函数getByClassName第二个参数有意义吗?到底怎么传第二个参数。不可能直接传一个标签名吧?

写回答

1回答

妮可妮可妮_

2018-08-19

  1. 不写正则匹配不到类名,如果正则里面为空可以匹配任何字符串,它匹配了所有的标签所以会html页面变为黄色

  2. 第二个参数需要传的是 dom,如果通过原生api可以获取对应类名的dom就用正则匹配

    祝学习愉快!

1

0 学习 · 4826 问题

查看课程