Question

我想在html页面上存储一些额外的数据，并且客户端按需使用这些数据来显示使用JS的不同内容。我该如何存储这些数据？在隐形div中，还是其他什么？有一些标准的方法吗？

Answer 1

我不认为有一种标准方式;我会将它们存储在JavaScript源代码中。

Answer 2

我认为如果你使用JS来显示它，你应该将它存储在某种JS数据结构中（取决于你想要做什么）。如果您只是想将一个元素换成另一个元素，那么隐形[在这里插入元素类型]也可以很好地工作。

Answer 3

其中一个：

隐藏的输入字段（如果要将其提交回服务器）;或
页面上的隐藏元素（由CSS隐藏）。

每个人都有申请。

如果你使用（1）来识别表单提交的某些内容，你就不应该在服务器上依赖它（比如来自客户端的任何东西）。（2）对于“丰富”工具提示，对话框和其他通常在页面上不可见的内容非常有用。通常，内容可视或适当克隆，可能会在此过程中进行修改。

Answer 4

如果我需要在将由javascript使用的html中放入一些信息，那么我使用

<input id="someuniqueid" type="hidden" value="..." />

Answer 5

隐形div通常是要走的路。如果你知道首先需要显示什么，你可以通过最初加载，然后使用AJAX调用加载页面上的其余元素来改善用户体验。

Answer 6

您需要将任何类型的数据存储为HTML结构中的HTML结构。我会说要正确地构建您打算显示的数据或内容，作为页面上显示的正确HTML。确保一切都是完整的，语义的和可访问的。然后确保CSS正确呈现数据。完成后添加内联样式“display：none;”到您希望动态显示的顶部容器。文本阅读器可以读取内联样式，因此在元素发生变化后，它们将无法读取它。

然后在准备好时使用JavaScript来更改容器的样式：

var blockit = function () {
    var container = document.getElementById("containerid");
    container.style.display = "block";
};

Answer 7

对于少量其他数据，您可以使用HTML5 "data-*" attribute

<div id="mydiv" data-rowindex="45">

然后使用jQuery data methods

访问theese字段

$("#mydiv").data("rowindex")

或按属性值选择项目

$('div[data-rowindex="45"]')

将附加数据附加到元素

$( "body" ).data( "bar", { myType: "test", count: 40 } );

在html页面上存储其他数据

7 个答案: