Могу ли я присоединить несколько команд к одному и тому же селектору jQuery

Question

простыми словами:

Это:

$('#password').html('Weak').css({'background-color' : '#FF0000' , 'color' : '#FFFFFF'});

равно этому?

$('#password').css({'background-color' : '#FF0000' , 'color' : '#FFFFFF'});
$('#password').html('Weak')

Они работают одинаково для меня - но я просто хотел быть уверен, что они действительно одинаковы ...

Answer 1

Почти.

$('#password').html('Weak').css({'background-color' : '#FF0000' , 'color' : '#FFFFFF'});

Создает объект jQuery для селектора #password один раз.

$('#password').css({'background-color' : '#FF0000' , 'color' : '#FFFFFF'});
$('#password').html('Weak')

Создает объект jQuery для селектора #password дважды.

Это имеет большое значение в этот раз? Не совсем : #something сильно оптимизирован в jQuery для быстрого использования document.getElementById для соответствия нужному элементу.

Однако, если у вас есть

$('input[value^=your_complex_selector],div div div,img[src$=.jpg]')

и вы продолжаете вызывать его снова и снова, не кэшируя его ... вы можете видеть, куда мы идем.

Вы можете получить преимущество в производительности от объединения в цепочку без потери читабельности, назначив объект jQuery переменной:

var password = $('#password');
password.css({'background-color' : '#FF0000' , 'color' : '#FFFFFF'});
password.html('Weak');

Answer 2

Да, всегда лучше связывать команды jquery.Это сохранит jquery для извлечения элемента каждый раз.

$('#password').html('Weak').css({'background-color' : '#FF0000' , 'color' : '#FFFFFF'});

лучше, даже если они выполняют ту же функцию.

$('#password').css({'background-color' : '#FF0000' , 'color' : '#FFFFFF'});
$('#password').html('Weak')

Answer 3

Да, результат тот же, но при первом подходе вам нужно найти этот элемент только один раз, и jQuery создаст только один объект jQuery, что сэкономит память.

Это называется цепочкой.Одна из замечательных функций библиотек, таких как jQuery.

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

var $password = $('#password');

$password.css({

  'background-color': '#FF0000',
  'color': '#FFFFFF'

});

$password.html('Weak');

Answer 4

Да, это называется цепочкой и предпочтительнее, чем во втором примере, потому что во втором примере вы снова находите элемент DOM поиска вместо того, чтобы использовать уже используемый в первом примере

Answer 5

ответ почти да , они равны, но первый запрос будет работать быстрее.

Второй запрос: дважды найдите в документе элемент #password

Answer 6

Ну, это обычно то же самое, но некоторые методы влияют на набор выбранных элементов, так что это не обязательно .В вашем конкретном случае, да, это точно так же.

Более эффективно использовать «цепочку», потому что DOM нужно искать только один раз.Когда поиск выполняется по «id», как в вашем примере, это не огромная экономия, а нечто.