Javascript 将JSON保存在HTML列表项中

我有一个javascript，可以在其中创建HTML中的列表项。目前，我可以用另一个脚本拖动和删除这些项目。现在，我想在创建的每个列表项中存储一些信息，例如

JSON

-对象。然后，我将数据以正确的顺序保存在数据库中

---

有可能吗，或者我应该换一种方式吗？

1-将数据以html格式保存在任何隐藏的div中 2-在任何唯一属性中添加数据

列表项
；
<li data-name="' + data-value + '"> List item </li>;

---

这应该能奏效。附加您认为合适的任何数据值和数据名称。

正如Nikhita所说，您可以将值作为数据值属性添加到列表项中。例如，如果要存储id和名称属性，可以执行以下操作，并使用jquery恢复值：

<li data-id="1" data-name="name" class="listItemClick"> List item </li>;
$(".listItemClick").click(function(){
     var id=  $(this).attr("data-id");
     var name = $(this).attr("data-name");
    //TODO

 });

列表项
；
$（“.listItemClick”）。单击（函数（）{
var id=$（this.attr（“数据id”）；
var name=$（this.attr（“数据名”）；
//待办事项
});

@Javier的答案在使用jQuery时有效

这些属性也可以通过常规Javascript访问

// Make sure you have a valid reference
var el = getElementBySomeMeans();

// Set the value
el.setAttribute("data-test-this", "10");

// Get the value
var v = el.getAttribute("data-test-this");
console.log(v);

// Clear the attribute
el.removeAttribute("data-test-this");

为了完整起见，我应该提到，有一个HTML5

dataset

方法也适用于数据属性，但我个人不使用它，因为我们必须在工作中支持较旧的浏览器

如果你有奢侈品，也许值得一看