Question

<html>
<head>
<script>
     function getTheValue()
     {

     }
</script>
</head>
<body>
    <div>
        <a href="http://google.com">
            <span class="text">Google</span>
        </a>
    </div>
    <div>
        <a href="http://yahoo.com"> 
            <span class="text">Yahoo</span>
        </a>
    </div>
    <input type="button" value="get" onclick="getTheValue()"></input>
</body>
</html>

嗨以上是我的代码在我想要雅虎的“href”值使用javascript但在这里我没有任何不同的类但基于孩子“span”值是“雅虎”我需要检索“a”标签“href”值如何？

Answer 1

使用:contains

$( "span:contains('Yahoo')" ).closest("a").attr("href")

等效的Javascript可以是

function contains(selector, text) {
  var elements = document.querySelectorAll(selector);
  return [].filter.call(elements, function(element){
    return RegExp(text).test(element.textContent);
  });
}

contains("span", "Yahoo").parentNode.href; // Will be the element parent href.

Source for fucntion to fetch element based on content in Vanilla JS

Answer 2

此代码可能会解决问题但方法getElementsByClassName（）支持IE9及以上，或者你可以使用getElementsByTagName（tagname）

 function getTheValue()
 {
     var patt = /Yahoo/i;
     var x = document.getElementsByClassName("text");
     var i;
     var spanElement;
     for (i = 0; i < x.length; i++) {
        if(patt.test(x[i].innerHTML))
        {
           spanElement = x[i];
           break;       
        }
     }
     var yourUrl = spanElement.parentNode.href;
     alert(yourUrl);
}

如何使用子值获取父标签属性href值

2 个答案: