Javascript 如何使用 jQuery 添加 HTML 属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3866063/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add an HTML attribute with jQuery
提问by Victor Ionescu
Well, I have this jQuery image slideshow that uses the attribute "control" inside an <a>. Seeing how it didn't validate I searched for a way to add this attribute inside my HMTL via jQuery but I didn't really find anything relevant. Now I don't really care about how valid my page is, but I'm really curious in how to add an HTML attribute inside an HTML tag.
好吧，我有这个 jQuery 图像幻灯片，它在 <a> 中使用了属性“control”。看到它没有验证我搜索了一种通过 jQuery 在我的 HMTL 中添加这个属性的方法，但我没有真正找到任何相关的东西。现在我并不真正关心我的页面的有效性，但我真的很好奇如何在 HTML 标记中添加 HTML 属性。
In case I wasn't clear enough with my explanation, I have this code:
如果我的解释不够清楚，我有以下代码：
<a id="previous" control="-6" href="#"></a>
And I want to add control="-6"with jQuery.
我想用 jQuery添加control="-6"。
回答by BrunoLM
Use jQuery's attrfunction
使用jQuery的attr功能
$("#previous").attr("control", "-6");
An example
一个例子
// Try to retrieve the control attribute
// returns undefined because the attribute doesn't exists
$("#previous").attr("control");
// Set the control attribute
$("#previous").attr("control", "-6");
// Retrieve the control attribute (-6)
$("#previous").attr("control");
See this example on jsFiddle
You can alternatively use datafunction to store values on elements. Works the same way, for example:
您也可以使用data函数来存储元素上的值。工作方式相同，例如：
$("#previous").data("control"); // undefined
$("#previous").data("control", "-6"); // set the element data
$("#previous").data("control"); // retrieve -6
Using datayou can store more complex values like objects
使用data您可以存储更复杂的值，如对象
$("#previos").data("control", { value: -6 });
($("#previos").data("control")).value; // -6
See a data example on jsFiddle
回答by user113716
Since the jQuery version has been wellcovered here, I thought I'd offer something different, so here a native DOM API alternative:
由于 jQuery 版本已经在这里得到了很好的介绍，我想我会提供一些不同的东西，所以这里有一个原生 DOM API 替代方案：
document.getElementById('previous').setAttribute('control','-6');
Yes, I know you asked for jQuery. Never hurts to know the native way too. :o)
是的，我知道您要求使用 jQuery。了解当地的方式也没有什么坏处。:o)
回答by Jayme Tosi Neto
Let me see if I understood you. You have, for example, the code:
让我看看我是否理解你。例如，您有以下代码：
<a id="previous" href="#"></a>
And by jQuery you want it to be:
通过 jQuery，您希望它是：
<a id="previous" control="-6" href="#"></a>
Is it right? If it is. You just have to do:
这样对吗？如果是。你只需要这样做：
$('#previous').attr('control', -6);
If an attribute doesn't exists it's created by jQuery. So, to remove it you can do:
如果一个属性不存在，它是由 jQuery 创建的。因此，要删除它，您可以执行以下操作：
$('#previous').removeAttr('control');
What you're doing doesn't respect the html rules and everything else, but it works fine, a lot of plugins do the same. ;D
你在做什么不尊重 html 规则和其他一切，但它工作正常，很多插件都做同样的事情。;D
I hope this could be helpful!
我希望这会有所帮助！
See you!
再见！
回答by KatieK
jQuery's attrwill do that. Example:
jQuery 的attr会做到这一点。例子：
$("#previous").attr("control", "-6");
Also check out this example at http://jsfiddle.net/grfSN/.
还可以在http://jsfiddle.net/grfSN/ 上查看此示例。
回答by ahmet2106
Try this:
尝试这个：
$('#previous').attr('control', '-6');
Why? the $.attr();function of jQuery allows you to add, get or update attributes (class, id, href, link, src, control and everything else!).
为什么？在$ .attr（）; jQuery 的函数允许您添加、获取或更新属性（类、id、href、链接、src、控件和其他所有内容！）。
回答by Adrian Godong
$("#previous").attr("control", "-6");
回答by davehauser
HTML:
HTML：
<a id="previous" href="#">...</a>
jQuery:
jQuery：
$('#previous').attr('control', '-6');
