获取父级不是 class 的元素

Question

我想 return javascript 中的一个元素，它的父元素中没有 class。

例如，我想获取以下代码片段中 没有 'parent' 的子 class 元素作为 class 对于父元素：

<div>
   <div class= "parent">
      <div class="child">
         Not to be selected 
      </div>
   </div>
   <div>
     <div class="child">
        To be selected
     </div>
   </div>
</div>

我试图通过量角器中的 xpath return 它

Answer 1

您可以使用 :not 选择器。

console.log(document.querySelectorAll(':not(.parent) > .child'));

<div>
   <div class= "parent">
      <div class="child">
         Not to be selected 
      </div>
   </div>
   <div>
     <div class="child">
        To be selected
     </div>
   </div>
</div>

Answer 2

有几种方法可以做到这一点。要么你检查 class 是否存在。

var elementList = [];
document.querySelectorAll("div.child").forEach(function(e) {
  var parent = e.parentElement;
  if(parent.classList == null || !parent.classList.contains("parent")) {

    elementList.push(e);
  }
})
console.log(elementList);

如果父 class 是特定的，您可以使用 css :not 属性

var elementList = document.querySelectorAll("div:not(.parent) > div.child");
console.log(elementList);

获取父级不是 class 的元素

Get Element that Parent not a class

javascript

css

xpath

element

protractor