|
Сообщение от ligisayan
|
|
вообщем как я понял data меняет код js, а setAttribute html и все работают только до перезагрузки
|
Метод .data() jQuery вообще не имеет отношения к атрибуту элемента data-var когда речь идет об установке этим методом какой либо переменной.
Если у элемента есть атрибут data-var, то метод element.data('var') вернет значение этого атрибута (начиная с версии jQuery 1.4.3). При этом, если значение этого атрибута корректная json-строка, то метод сразу преобразует это значение в объект, например, если data-var="[2,3]", то .data('var') вернет массив. В случае, если имя атрибута будет иметь более сложное сочетание через дефис, типа data-var-name, то получить его можно в camelCase: element.data('varName').
Но записать/изменить значение в data-var метод .data('var', value) не может, вместо этого он создаст переменную var со значением value, которая будет привязана к элементу, для которого был вызван этот метод (можно привязать к элементу и несколько переменных .data({var1: value1, var2: value2, ....}) ). Для этого и предназначен данный метод. Удалить эту переменную у элемента можно методом .removeData(). А вот метод javascript setAttribute будет изменять значение именно атрибута.
Вот так это выглядит:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(function() {
var p = $('p');
//получили значение атрибута
alert(p.data('var'));
//думаем, что изменяем его
p.data('var', 55);
//радуемся
alert(p.data('var'));
//а на самом деле воз и ныне там
alert(p[0].getAttribute('data-var'));
});
</script>
</head>
<body>
<p data-var="22">Text</p>
</body>
</html>
После того как элемент получил собственную jq-перменную "var" .data('var') будет обращаться уже к ней, а не к атрибуту data-var элемента.