Есть ли какое-либо различие в производительности между использованием двух отдельных вызовов для сокрытия двух элементов, или было бы больше/меньше эффективно использовать только 1 оператор? Есть ли какое-либо практическое различие?
$('#container1').hide();
$('#container2').hide();
по сравнению с:
$('#container1, #container2').hide();
Кроме того, которые делают Вы думаете, более читаемо?
Есть небольшая разница в производительности, так как один и тот же делегат вызывается на оба элемента, но это очень, очень незначительное выделение памяти. Любые лишние строки кода также означают больше работы для javascript-интерпретатора и работы для браузера... это большая разница, но все же бесконечно малая.
Короткий ответ: второй немного быстрее/менее использует память, он настолько безумно незначителен, что его, вероятно, не удалось бы измерить без петлевания десятки тысяч раз.
Это не имеет значения с точки зрения эффективности. Думаю, что второй вариант лучше подходит для удобочитаемости, если не нужно прикреплять отдельные события к одному из элементов: $('#containter1').hide().html('foo');
...и ни к какому другому элементу.
В данном конкретном случае это не будет иметь практического значения. Вы все еще ищете два конкретных идентификатора в DOM.
Что касается удобочитаемости, я бы оставил их в одном выражении, пока они логически сгруппированы.
Однако, если ваша следующая строка - это что-то, что работает с контейнером 2 отдельно, тогда разделите 2. Нет необходимости выполнять дополнительные обходы. Например:
//2 dom traversals
$('#container1').hide();
$('#container2').hide().html(some_html);
быстрее, чем
//3 dom traversals
$('#container1, #container2').hide();
$('#container2').html(some_html);
Оба почти одинаковы, второй на несколько символов короче, если это важно для вас.