Question

我有以下代码结构，但我无法获得href的值

<div class="">
  <div class="">
    <div class="">
      <a href=""><img src=""></a>
    </div>
  </div>
</div>

ev.target.getAttribute（“href”）ev.target.parentNode.getAttribute（“href”）无效。

我应该提一下，包含在a标签中的img标签也有一个悬停状态。我想点击图片，获取href，preventDefault行为并触发其他一些事情。

Answer 1

我尝试它正在运作。

JavaScript的：

document.getElementById("link").addEventListener("click", function(event){
document.getElementById("result").innerHTML = event.target.getAttribute("href");
});

HTML：

<div class="a">
  <div class="b">
    <div class="c">
      <a href="http://www.google.com" id="link" onclick="return false">Google</a>
    </div>
  </div>
</div>
<div id="result"></div>

实施例： https://jsbin.com/mezonedeko/edit?html,js,output

如果我误解了你的意思，你能给我完整的代码示例，你使用的浏览器，谢谢。

Answer 2

你可以使用＆＃39;这个＆＃39;事件的变量

＆＃13;

document.getElementById("attr1").addEventListener("click", function(ev) {
  ev.preventDefault();
  alert(this.getAttribute("href"));
  alert(this.href);
});

＆＃13;

<div class="">
  <div class="">
    <div class="">
      <a id="attr1" href="hrefContent">Get Href</a>
    </div>
  </div>
</div>

＆＃13;

Answer 3

由于您未在addEventListener上指定任何事件，因此我假设有mouseenter之类的事件。我假设锚标记a是您应用程序中的第一个锚标记。

请找到工作演示here。

<强> HTML：

<div class="">
    <div class="">
        <div class="">
            <a href="\something">This is a link</a>
        </div>
    </div>
</div>

<强> JS：

var a = document.getElementsByTagName('a')[0].href;
console.log('Href of \'a\' at load = ' + a);

document.getElementsByTagName('a')[0].addEventListener('mouseenter', function () { /*event can be any other like 'click', 'mouseout', etc.*/
    console.log('Href of \'a\' on an event = ' + this);
});

如何让href关闭一个标签

3 个答案: