Question

有没有办法，如何在没有jQuery的情况下从“a”标签中获取href属性的字符串值？我有一个字符串（例如）这个内容 - <a href="www.something">。

如何获取变量的href属性值？

Answer 1

我有（例如）此内容的字符串 - <a href="www.something">

如果它实际上是一个字符串，如下所示：

var s = '<a href="www.something">';

然后你可以使用.match() method的正则表达式：

var href = s.match(/href="([^"]*)/)[1];
// href is now www.something

如果它是您网页上的元素，请查看T.J. Crowder's answer（我无需在此处复制该信息）。

Answer 2

如果您确实将作为字符串，那么refer to nnnnnn's answer。

或者，如果您在浏览器环境中，则可以选择

var str = '<a href="www.something">';
var div = document.createElement('div');
div.innerHTML = str + "</a>"; // Make it a complete tag
var link = div.firstChild.getAttribute("href");

如果您在通过该标记创建的页面上有实际元素，则：

如果你有对元素的引用，你可以从中获取href：

var link = theElement.href;
// or
var link = theElement.getAttribute("href");

通过getAttribute获取它会返回实际属性的值而不是完全限定版本，并且href反射属性将获得完全限定版本（例如，相对链接将被扩展）。

获取元素的引用是一个广泛的主题。如果它有id，您可以使用getElementById。或者，如果您正在响应某个事件并且事件发生在您想要的元素附近，则可以使用各种DOM properties and methods导航到该事件。使用a lot of modern browsers，您可以使用CSS选择器和querySelector（找到一个元素）或querySelectorAll（列表）。

例如，这会为您提供页面上第一个包含href类的链接的"foo"：

console.log(document.querySelector("a.foo").href);

完整示例：Live Copy | Live Source

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Getting the Link</title>
</head>
<body>
  <a id="theLink" href="/relative/link">Link</a>
  <script>
    (function() {
      var theLink = document.getElementById("theLink");
      display("<code>href</code> property: " + theLink.href);
      display("<code>getAttribute('href')</code>: " +
              theLink.getAttribute("href"));

      function display(msg) {
        var p = document.createElement('p');
        p.innerHTML = String(msg);
        document.body.appendChild(p);
      }
    })();
  </script>
</body>
</html>

Answer 3

以下代码将遍历所有<a/>元素并记录其href值（如果有的话）：

var anchors = document.getElementsByTagName('a');
var i, len = anchors.length;

for( i = 0; i < len; i++ ) {
    console.log(anchors[i].getAttribute('href'));
}

获取<a> tag without jQuery</a>的href属性值

3 个答案: