Javascript 按唯一子元素查找父元素，但单击另一个子元素

试图找到正确的xpath选择器。元素只有

href

唯一。是否可以通过iphone X的文本和父类

class=“card h-100”

找到元素。但单击父类的另一个子类

  <div class="card h-100">
    <div class="card-body">
      <h4 class="card-title">
        <a href="#">iphone X</a>
      </h4>
    </div>
    <div class="card-footer">
     <button class="btn btn-info"></button>
    </div>
  </div>

---

使用

queryselectoral（）

（函数（）{
var a=document.querySelectorAll（'a[href=“#”]”）；
var结果=[]；
a、 forEach（函数（el）{
if（el.innerHTML==“iphone X”&&el.parentElement.parentElement.parentElement.className.includes（'card h-100'））{
结果：推挤（el）；
}
});
控制台日志（结果）；
})();
以下是您正在寻找的XPath，并给出了解释

//div[@class='card h-100'][.//a[.='iphone X']]//button
^ find a DIV
     ^ with this class
                          ^ that has a child A
                                ^ with text = 'iphone X'
                                              ^ once you find that DIV, find the child BUTTON

如果我理解正确，您希望单击下一个子类中与文本为“iphonex”的“a”对应的按钮。为此，可以使用以下xpath：

//a[text()='iphone X']//ancestor::div//button[@class='btn btn-info']

希望有帮助：）
要查找与文本iphone X相关的元素
，该文本有一个带有
class=“card h-100”
的父节点，您可以使用以下选项：


xpath
：

//div[@class='card h-100']//a[text()='iphone X']//following::button[@class='btn btn-info']


你的意思是
href=“#”
和text
iphonex
？？另外，您的
class=“card h-100”
编辑的我的代码在哪里，很抱歉您的代码不完整，请您进一步编辑它好吗？编辑后，现在应该使用此方法完成，它会在页面上找到所有具有
class='btn btn info'
@IhorHarmatii请使用xpath
//a[text（）='iphone X'//祖先：：div[@class='card h-100']//按钮[@class='btn btn info']
。使用此方法，它将只查找div下类为
card h-100
的按钮。使用此方法，它将查找页面上具有
class='btn btn info'