HTML5 自定义属性

HTML5 允许你在元素上添加自定义属性。自定义属性需要以 "data-" 开头，这样浏览器能够识别它们并且在必要时保留它们。

解决方案1：

<div id="myDiv" data-my-attribute="someValue"></div>

在这个例子中，我们在div元素上添加了一个自定义属性，名为"data-my-attribute"，值为"someValue"。

解决方案2：

通过JavaScript添加和获取自定义属性：

<div id="myDiv"></div>

var div = document.getElementById('myDiv');
div.setAttribute('data-my-attribute', 'someValue'); // 设置自定义属性
var attributeValue = div.getAttribute('data-my-attribute'); // 获取自定义属性

在这个例子中，我们首先通过document.getElementById获取div元素，然后使用setAttribute方法在div元素上添加自定义属性，最后使用getAttribute方法获取自定义属性的值。

解决方案3：

通过jQuery添加和获取自定义属性：

<div id="myDiv"></div>

var $div = $('#myDiv');
$div.attr('data-my-attribute', 'someValue'); // 设置自定义属性
var attributeValue = $div.attr('data-my-attribute'); // 获取自定义属性

在这个例子中，我们首先通过jQuery选择器获取div元素，然后使用attr方法在div元素上添加自定义属性，最后再次使用attr方法获取自定义属性的值。