如何使用CSS選擇器獲取href文本

Question

我在Wikipedia主頁上的https://www.wikipedia.org/上具有以下HTML。 我正在嘗試獲取href文本

//en.wikipedia.org/

<div class="central-featured-lang lang1" lang="en">
<a href="//en.wikipedia.org/" title="English — Wikipedia — The Free Encyclopedia" class="link-box">
<strong>English</strong><br>
<em>The Free Encyclopedia</em><br>
<small>5&nbsp;077&nbsp;000+ articles</small>
</a>
</div>

我已經試過這個$$('.central-featured-lang.lang1 a[href$=".org/"]')但是我仍然得到了整個輸出，而不僅是href文本。

[<a href=​"/​/​en.wikipedia.org/​" title=​"English — Wikipedia — The Free Encyclopedia" class=​"link-box">​…​</a>​<strong>​English​</strong>​<br>​<em>​The Free Encyclopedia​</em>​<br>​<small>​5&nbsp;077&nbsp;000+ articles​</small>​</a>​]

任何建議深表感謝。

Answer 1

使用DOM元素的getAttribute（）方法

getAttribute（）返回元素上指定屬性的值。 如果給定的屬性不存在，則返回的值將為null或“”（空字符串）；否則為0。 有關詳細信息，請參見注釋。

 var element = document.querySelector('a.link-box'), link = element.getAttribute('href'); alert(link) 

 <div class="central-featured-lang lang1" lang="en"> <a href="//en.wikipedia.org/" title="English — Wikipedia — The Free Encyclopedia" class="link-box"> <strong>English</strong> <br> <em>The Free Encyclopedia</em> <br> <small>5&nbsp;077&nbsp;000+ articles</small> </a> </div> 

Answer 2

在Javascript中，您可以將document.querySelector與href屬性一起使用，如下所示：

 var url = document.querySelector('.central-featured-lang.lang1 a[href$=".org/"]').href; alert(url); 

 <div class="central-featured-lang lang1" lang="en"> <a href="//en.wikipedia.org/" title="English — Wikipedia — The Free Encyclopedia" class="link-box"> <strong>English</strong> <br> <em>The Free Encyclopedia</em> <br> <small>5&nbsp;077&nbsp;000+ articles</small> </a> </div> 

Answer 3

使用.attr()方法：

$('.central-featured-lang.lang1 a[href$=".org/"]').attr("href")

 var url = $('.central-featured-lang.lang1 a[href$=".org/"]').attr("href"); alert( url ); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="central-featured-lang lang1" lang="en"> <a href="//en.wikipedia.org/" title="English — Wikipedia — The Free Encyclopedia" class="link-box"> <strong>English</strong><br> <em>The Free Encyclopedia</em><br> <small>5&nbsp;077&nbsp;000+ articles</small> </a> </div>