Question

因此，html元素可以具有可以说明元素的属性。但是，如果存储的数据是敏感的，那么任何人都可以看到这些属性。那么你可以使用javascript / jquery或其他东西在html元素中存储数据吗？

喜欢（使用jQuery）如果我有一个#apple div并且想要向它附加一个秘密数据（红色）。我可以用这个逻辑做点什么吗？：

$("div#apple").secret = "red";
or 
$("div#apple").data = { "color": "red" };
alert("The color of an apple is " + $("div#apple").secret);

我猜测一种方法是创建一个jQuery函数来绑定到html元素，然后将数据绑定到该函数，但是有更简单/更好的方式来拉这样的东西吗？

另外，我知道html 5允许自定义属性，是否有任何版本的html允许/上面没有javascript / jquery？

Answer 1

是的，jQuery's .data()就是您所需要的。它以键值方式存储数据。

您可以这样使用它：

$('.where').data('key', 'value');
$('.where').data('dog', {'name': 'fritz'});

然后你可以用这种方式检索它：

$('.where').data('key'); // value
$('.where').data('cat'); // null, nothing exists with the cat key
$('.where').data('dog'); // object, {'name': 'fritz'}

它可以存储您内部对象jQuery.cache中的所有数据。

Answer 2

jQuery data方法可用于在元素上存储任意数据。如果没有data-*属性与元素本身使用的名称相匹配，则jQuery将在内部存储数据，并且不应通过任何DOM检查器显示。

这是working example。

但是，您应该意识到，无论您多么努力地隐藏它，客户端始终都可以看到任何客户端。如果你有“秘密”数据，最安全的地方就是在服务器上。

Answer 3

使用jQuery的.data()功能，例如

$("#apple").data("color", "red");

var color = $("#apple").data("color"); // "red"

Answer 4

我认为第二个是非常安全的方法。但请记住，最后该值将存储在浏览器内存中。我相信一定有办法嗅到这个。记住一件事，如果你想要一些安全的东西，不要在网上投入。

Answer 5

实际上，您可以在HTML标记中使用自己的属性，例如。该文档不会验证，但浏览器只会忽略它们无法识别的属性;从早期开始就是HTML中的做法。

但是，为了避免与标准属性，特定于浏览器的属性以及将来对它们的扩展发生冲突，最好使用“data- * attributes”的HTML5约定，例如：

正如你所说，你正在寻找“没有javascript / jquery”的东西，我想这可以用于像专门的索引机器人这样的东西 - 至少有一些机器人用于全站点搜索系统使用额外的属性。在这种情况下，请检查机器人的解析例程是否接受包含连字符“ - ”的属性名称（一些天真的解析器可能无法执行此操作）。

数据当然可供任何使用例如的人使用。查看来源。如果数据是敏感的，则不应出现在HTML源代码中。在某些情况下，您可以考虑包含一个标识号或字符串，作为安全存储在服务器上的信息的索引。

将自定义数据（隐藏）附加/添加到html元素？

5 个答案: