Получить значение href atribute тега без jQuery

есть ли способ, как без jQuery получить из строки значение атрибута href в теге "a"? У меня есть строка с (например) этим контентом - <a href="www.something">.

Как я могу получить значение атрибута href в переменную?

6
href javascript

3 ответов

у меня есть строка с (например) этот контент - <a href="www.something">

если это на самом деле в строке следующим образом:

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

затем вы можете использовать регулярное выражение с .match() метод:

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

если это элемент на Вашей странице, тогда посмотреть ответ Ти Джея Краудера (мне не нужно дублировать эту информацию здесь).

6

если у вас действительно есть что в строке, потом см. ответ nnnnnnn.

или поочередно, если вы находитесь в среде браузера:

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. Или, если вы отвечаете на событие, и событие происходит на элементе рядом с тем, который вы хотите, вы можете использовать various свойства и методы DOM для перехода к нему. С много современных браузеров, вы можете используйте селекторы CSS и либо querySelector (найти один элемент) или querySelectorAll (список).

например, это дает вам href первая ссылка на странице, которая имеет класс "foo":

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

полный пример: Скопировать Видео | Живой Источник

<!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>
9

следующий код будет зацикливаться на всех <a/> элементы и журнал их href значение (если оно есть):

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

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