.prop() против .data()

#jquery

#jquery

Вопрос:

С новой версией jQuery v1.6 и добавлением .prop() метода.

Есть ли внутренняя разница в использовании .prop() over .data() ?

Я вижу в документации, что не удаление свойства может привести к утечкам памяти в версиях IE до IE9. Но есть ли какие-либо другие проблемы с производительностью или другие проблемы с использованием нового prop() метода?

Синтаксис с сайта:

 var $para = $("p");    
$para.prop("luggageCode", 1234);
  

Из-за следующего:

 var $para = $("p");
$para.data("luggageCode", 1234);
  

Ответ №1:

Я считаю, что prop предназначен для установки допустимых свойств HTML-документа, а не произвольных данных. Я бы посоветовал вам продолжать использовать данные для получения информации о типе кода багажа.

Комментарии:

1. Это и моя мысль, но можете ли вы привести какие-либо документы, подтверждающие это утверждение? И это также не отвечает на вопрос о проблемах с производительностью.

2. Также данные («foo», «bar») установят <элемент data-foo=»bar»/> не <элемент foo=»bar»/>

3.На самом деле data("foo","bar") установит данные для объекта jQuery и не установит атрибут элемента HTML DOM (для этого вам понадобится attr("data-foo", "bar") [также prop("data-foo", "bar") ничего не добавит в DOM]).

4. Уточнение: data метод может извлекать data-* данные атрибута, но не может их изменять. Например, если <elm data-foo="foo" /> находится в DOM, $("elm").data("foo") будет возвращать, "foo" если $("elm").data("foo", "bar") не будет вызван первым, тогда он вернется "bar" и <elm data-foo="foo" /> останется неизменным. Поэтому лучше всего использовать attr для получения и установки любых data-* переменных, чтобы исключить возможную путаницу.

Ответ №2:

Я думаю, это сводится к разнице между свойством узла DOM и свойством объекта Javascript, который его представляет.

В документации не указано, как или где .data() хранятся данные, поэтому тот факт, что вы видите это как свойство соответствующего объекта jQuery, может быть просто деталью реализации. jQuery также было бы разрешено хранить его абсолютно в любом другом месте.

В отличие от этого, .prop() конечно, явно относится к свойствам узла DOM.

Ответ №3:

Возможно, я ошибаюсь в этом, но кажется, что это .data() может быть перечислено, в то время как .prop() не может.

Живая демонстрация

 var $p = $("<p>");
    $p.data('luggagecode', '12345');
    $p.data('luggagecode_backup', '54321');

for (var key in $p.data()) { // generates two alerts
    var value = $p.data(key);
    alert('DATA | ' key ' = ' value);
}

var $p2 = $("<p>");
    $p2.prop('luggagecode', '12345');
    $p2.prop('luggagecode_backup', '54321');

for (var key in $p2.prop()) { // no alerts
    var value = $p2.prop(key);
    alert('PROP | ' key ' = ' value);
}
  

Комментарии:

1. Я не собираюсь понижать ваш голос, потому что вы на правильном пути, но свойства определенно можно перечислить . Я думаю, вам следует пересмотреть этот ответ и сказать, что он .data() предназначен для пользовательских данных и .prop() фактически добавляет / обновляет свойство элемента DOM.