如何将自定义属性添加到 <span> 并在 JavaScript 中读取？ [复制]答案

【问题标题】：How can I add a custom attribute to a <span> and read it in JavaScript? [duplicate]如何将自定义属性添加到 <span> 并在 JavaScript 中读取？ [复制]
【发布时间】：2014-08-08 03:55:00
【问题描述】：

我想要一个使用<span> 元素作为导航链接的jQuery/PHP 站点。我需要有一个value 属性才能使用

$(".navLink").click(function() {
    window.location.href = "/index.php?page=" + this.value //or whatever
});

我不能使用this.id，因为它与其他 HTML 元素冲突。有什么方法可以创建和使用“虚拟”HTML 属性？

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

使用 data-* 属性。像 data-href 这样的东西会很好。 jQuery 为您提供了一个很好的界面来读取值。

this.data('href')

将读取的值

data-href="some.value"

请参阅http://api.jquery.com/jquery.data/ 了解更多信息。

【讨论】：

你会怎么做呢？我对这种东西很陌生。

【解决方案2】：

纯js：

el.setAttribute('value', the-value);

jquery:

$(el).attr('value', the-value);

但最好将my-value 之类的易于识别的内容作为属性名称，以避免冲突并使它们在代码中更容易被注意到

【讨论】：

【解决方案3】：

您可以使用data-。所以在你的 HTML 中，你可以这样定义它：

<span class="navLink" data-link="google.com">click me</span>

然后通过 jQuery 你就这样做了：

window.location.href = "/index.php?page=" + $(this).data("link");

【讨论】：