在我们的项目中，我们都使用input type=hidden元素和divs display:none css来存储html页面上的一些数据而不向用户显示。
所以我想知道哪种方式更适合性能和代码完整性以及html语义？
答案 0 :(得分：6)
隐藏的输入将被隐藏，无论文档（CSS）的样式规则如何，这可能会使性能更好，但我没有数据来显示这一点。话虽如此，输入控件应作为表单的一部分提交。
还有其他方法，例如HTML5自定义数据属性或使用脚本标记：
<!-- Custom data attribute -->
<div id="product" data-id="42">
<h1>Product name</h1>
</div>
<!-- JSON data embedded in a script tag -->
<script type="application/json">
{ "id": 42 }
</script>
答案 1 :(得分：3)
语义决定了答案 - 这取决于你如何使用它。
如果数据需要作为表单提交或与表单密切相关，则使用输入。我不确定哪种情况不属于该类别，因为如果用户不应该看到，那么仅在一个页面上使用的数据可以存储在javascript变量中。
答案 2 :(得分：3)
表现涉及很多因素。但除非您存储大量数据，否则性能差异可能无法区分。
对代码完整性和语义的最佳选择取决于数据以及如何使用它。
存储数据有很多选择：
将数据存储在隐藏输入中，非常适合与表单一起使用：
<input name="mydata" type="hidden" value="some data" />
将数据存储在隐藏的html标记中，这经常被搜索引擎所厌恶，因为它在尝试提高搜索引擎优化排名时被滥用：
<div id="mydata" style="display:none">
some data
</div>
在javascript中存储数据 ，非常适合快速轻松访问：
<script type="text/javascript">
var data.id = 123;
var data.list = ["Yes","No","Maybe"];
</script>
将数据存储在META标记中，这是我在极少数情况下使用的：http://code.lancepollard.com/complete-list-of-html-meta-tags#create-custom-meta-tags
<meta name="mydata" content="some data"/>
将数据存储在Cookie 中，只要尚未禁用Cookie，此选项就会允许数据过期： http://www.w3schools.com/js/js_cookies.asp
HTML5有一个 SQLite数据库：
HTML5规范允许自定义数据属性
答案 3 :(得分：1)
我认为，第一个解决方案（输入类型=隐藏）更漂亮，因为第二个解决方案依赖于css，可能会在浏览器中禁用，并且您的数据将显示给用户。