JavaScript根据选择器字符串判断当前元素是否与选择器匹配

编写一个 match 函数。它接受两个参数,第一个参数是一个选择器字符串性质,第二个是一个 HTML 元素。这个元素你可以认为它一定会在一棵 DOM 树里面。通过选择器和 DOM 元素来判断,当前的元素是否能够匹配到我们的选择器。(不能使用任何内置的浏览器的函数,仅通过 DOM 的 parent 和 children 这些 API,来判断一个元素是否能够跟一个选择器相匹配。)以下是一个调用的例子。

<div id="id1" class="class1">
  <div id='id2' class='class2 class3'>
    <div id='id3' class='class4 class5 class6'></div>
  </div>
</div>
function match(selector, element) {
  let selector_arr = selector.split(' ');//获取element层级
  let parent_arr = [];//用于保存父节点
  let selector_re = /(\w+)|(\.\w+)|(\#\w+)/g;
  for(let i = 0; i < selector_arr.length; i++){
    parent_arr.push(selector_arr[i].match(selector_re));
  }
  
  let matched = true;
  //从当前节点开始向上循环
  for (let j = parent_arr.length-1;
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值