用另一个元素的本地CSS样式为一个元素添加样式

Question

我想要实现一个段落文本，其中一些单词使用浏览器的原生样式作为 <a> 标签。

这些单词可能真的在 <a> 标签中，其具有 href 属性以引导用户到另一个 URL，或者它们可能在伪装的 <span> 标签中，带有 js onclick 函数。

如何获取 <a> 标签的原生样式属性，并将其应用于我的 <span> 标签？

- grateful

---

在某些浏览器中，一旦用户访问了链接，会去除 <a> 标签的下划线和颜色变化。 - grateful

没有 CSS 的“复制”样式的方法...为什么不定义一个类别来描述它们的外观，并将其应用于链接/跨度等。 - Paulie_D

除了您希望保留的链接下划线之外，本地样式化的a标签与span标签有何不同？ - chiliNUT

唯一适用于锚点而不是 span 的本地样式将是颜色，文本装饰和指针样式，不是吗？ - Paulie_D

为什么要使用本地浏览器样式？这并不总是在其他浏览器中保持一致（因为它是浏览器定义的），而且根据我的经验，它基本上总是看起来很丑。我建议只使用多个选择器：a，span.fakelink { }。 - TARDIS Maker

Answer 1

很简单：你不能。

你可以使用 SASS 和 LESS 来扩展元素的属性，但无法扩展特定标签的本机属性。 更简单的方法是给两个元素赋予相同的CSS类并相应地设置样式。

这不应该成为噩梦，因为 <a> 和 <span> 标签在页面流中的行为非常相似。

- André Ramos

---

我不喜欢认为任何事情都是不可能的。也许你是正确的，但我想要做更多的研究，看看是否有其他的答案在接受这个答案之前。例如，我发现在GitHub上有更新的用户代理样式表，链接在这里：link。 - grateful

Answer 2

获取元素的目标属性值：

var x = document.getElementById("myAnchor").getAttribute("target");

获取 <button> 元素的 onclick 事件属性的值：

var x = document.getElementById("myBtn").getAttribute("onclick");

查找一个 <button> 元素是否有 onclick 属性：

var x = document.getElementById("myBtn").hasAttribute("onclick");

获取具有id="myAnchor"的<a>元素。

var x = document.getElementById("myAnchor"); 

如果元素具有目标属性，请将其值设置为"_self"。

if (x.hasAttribute("target")) {      
    x.setAttribute("target", "_self");
}

- Atanu