Question

不久前我注意到我可以在Javascript中执行此操作。我可以创建一个按钮div并将数组，对象或值附加到它上面。

var newDiv = document.createElement("div");
newDiv.id = dName
newDiv.value = value;

稍后，当点击div时，我可以像这样调用这些数据：

function clickFunction(e){
    console.log(e.path[0].value, "clicked");
    var itemArray = e.path[0].value;
    console.log(itemArray.inputRequest.length, "dataReqs needed");
}

我想知道这是否合适。我不知道这个数据的位置是否总是.path [0]。任何人都可以确认这是否是一个好的做法？我正在开发一个需要大量自动化Div的UI，因此我尽量保持一切尽可能自动化和简单化。 没有图书馆的答案。

Answer 1

HTML5规范中有data-个属性专门为此目的而引入。

https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes

因此，您可以重写代码以使用它们。

var newDiv = document.createElement("div");
newDiv.id = 'some name';
newDiv.dataset.value = 'some value';


function clickFunction(e){
    console.log(e.target.dataset.value);
}

document.body.appendChild( newDiv );
newDiv.addEventListener('click', clickFunction);

http://jsfiddle.net/5dvheb0k/

Answer 2

一切都是一种观点，但你会发现很多'没有'这个答案。为什么呢？

基本模式是MV *。我强烈建议阅读此内容 chapter基本JavaScript设计模式。

最后，它取决于您想要存储多少数据。如果它变得复杂，将其移动到模型或控制器。有为此目的的选项（read here more on HTML data-attribute）。

如果您存储的不仅仅是简单的数字或字符串，我建议不要这样做。

反对的原因：

如果其他人也操纵您的代码，则更容易遵循设计模式，因此每个人都对您的代码有相同的理解。
将数据存储在模型中或控制器内部。优点是您无需单击按钮即可访问它们。
如果将它们存储在模型/控制器中，则可以更轻松地共享数据。
您的所有数据都将在DOM中显示。当您查看渲染的HTML并尝试查找错误时，它变得非常难看。
以这种方式测试数据非常困难。

将数组或对象存储在div中是一种很好的做法吗？

2 个答案: