下面我有一个带有Java脚本的html:

document.addEventListener('mousedown', function(event) {
  let elem = event.target;
  let jsonObject = {
    Key: 'mousedown',
    Value: event.button
  };
  if (event.button == 2) {
    console.log(elem.outerHTML);
  }
});
<span style="font-size:xx-large">
    <a href="https://microsoft.com" target="_blank" rel="noreferrer noopener" shape="rect" style="color:rgb(17,85,204)">
        <i>
            <font color="#ff0000">Microsoft</font>
        </i>
    </a>
</span>
<br/>
<a href="https://google.com">Google</a>
<div>

当我右击链接时,它应该会提醒我里面的超链接.

Google可以正常工作.但当右键单击Microsoft时,它总是返回font标记.

我也试过这个,还是不管用:

document.addEventListener('mousedown', function (event)
                              {
                                let elem = event.target;
                                let name = elem.tagName;
                                let jsonObject =
                                {
                                    Key: 'mousemove',
                                    Value: name == 'A' ? elem.outerHTML : ' '
                                };

                                if(event.button == 2 && name == 'A') 
                                  {alert(elem.outerHTML);}
                              });

有没有一种通用的方法来获取a个标签中的链接?

推荐答案

您可以遍历父 node ,直到找到锚点,如下所示:

document.addEventListener('mousedown', event => {
  let elem = event.target;
  while(elem && elem.tagName!=='A') elem = elem.parentElement; 
  if(elem) {
    let jsonObject = 
    {
        Key: 'mousedown',
        Value: event.button
    };
    if(event.button == 2) {alert(elem.href);}
  }
});
<span style="font-size:xx-large">
    <a href="https://microsoft.com" target="_blank" rel="noreferrer noopener" shape="rect" style="color:rgb(17,85,204)">
        <i>
            <font color="#ff0000">Microsoft</font>
        </i>
    </a>
</span>
<br/>
<a href="https://google.com">Google</a>
<div>

Javascript相关问答推荐

如何将拖放功能添加到我已自定义为图像的文件输入HTML标签中?

使用AJX发送表单后,$_Post看起来为空

按钮未放置在html dis位置

. NET中Unix时间转换为日期时间的奇怪行为

如何在coCos2d-x中更正此错误

在HTML语言中调用外部JavaScript文件中的函数

TinyMCE 6导致Data:Image对象通过提供的脚本过度上载

为什么可选参数的顺序会导致问题?

AJAX POST在控制器中返回空(ASP.NET MVC)

传递方法VS泛型对象VS事件特定对象

expo 联系人:如果联系人的状态被拒绝,则请求访问联系人的权限

如何更改Html元素S的 colored颜色 ,然后将其褪色为原始 colored颜色

更改agGRID/Reaction中的单元格格式

JavaScript将字符串数字转换为整数

FindByIdAndUpdate在嵌套对象中创建_id

在没有任何悬停或其他触发的情况下连续交换图像

递增/递减按钮React.js/Redux

使用静态函数保存 node 前的钩子

用内嵌的含selenium的Java脚本抓取网站

使用导航时,路径的所有子组件都必须是路径