javascript - 如何在我的 ReactJS 应用程序中添加 Wikipedia 样式引用？

Question

我想创建上标标签，如果单击该标签，会将用户重定向到引用文献，就像维基百科一样。

现在，我创建了上标标签并尝试为其设置 href 属性，但是当我单击时没有任何反应，即使检查元素显示 href 属性具有已正确应用于 sup 标记。

这是我尝试过的:

useEffect(() => {
    let sup = document.querySelectorAll("sup");

    if(sup && sup.length > 0 ) {

    sup[0].setAttribute("href", 'https://www.google.com');
    console.log(sup, "sup")
    
    }
  }, [articles])

Answer 1

sup 元素没有 href 属性，也无法导航。

您需要将需要导航到的链接的 href 注入(inject)到 anchor 标记内。

let sup = document.querySelectorAll("sup");

if (sup && sup.length > 0) {
  sup[0].innerHTML = `<a href="https://www.google.com">${sup[0].innerHTML}</a>`
}

link<sup>1</sup>