javascript - 在 Javascript 中的触发事件上添加 anchor 标记

Question

我一直在努力添加 <a></a>上mouseup或click html 文档中的事件。

我的要求是在用户点击html页面时在点击的部分添加 anchor 标记。

document.documentElement.addEventListener('click', function(e){
  var tgt = e.target;
  if (tgt && tgt.nodeName === 'SPAN') {
    alert(e.target.id);
    tgt.classList.add('strong');
    var randomString = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
    alert('#'+randomString);
    var attrHref = '#'+randomString;
    tgt.id.add(randomString);
    tgt.href.add(attrHref);
    var newNode = document.createElement('div');
    //g.setAttribute('id', randomString);
    //alert( e.currentTarget === this );
    var a = document.createElement('a');
    a.href = attrHref;
    alert(a.href);
    //a.setAttribute('href', '#'+randomString);
    //g.appendChild(a);
    alert("afterAppendChild");
    tgt.href = attrHref;
    tgt.insertAdjacentElement("afterbegin", a);
    document.activeElement.insertAdjacentElement("afterbegin", a);
    alert("after insertA");
    alert('done');      
  }
});

在 html 中，我在 DOM 元素中没有可以获取的特定 ID，因此我尝试添加 <a></a>用户点击的位置的标签。我可以将文本加粗，但无法添加 <a></a>

请指导我如何实现这一目标。

Answer 1

与许多标签一样，该属性具有 onclick 事件 ( https://www.w3schools.com/jsref/event_onclick.asp )

您希望向所有 A 添加“onclick”事件，然后从以下内容开始:document.getElementsByTagName("a")

它将返回页面上所有内容的数组。然后添加监听器:addEventListener('点击'..)

所以你会得到这样的东西:

document.getElementsByTagName("a").addEventListener('click',(event) => {
//    YOUR FUNCTION HERE 
// if the user should not be moved to the href add:
// return false
// or use event.preventDefault()
})