Как заморозить просмотр веб-браузера при изменении видимости элементов?

Я уже давно не разработчик JS (на самом деле, вряд ли разработчик), но я хотел попытаться написать небольшой Greasemonkey script, чтобы скрыть несколько элементов на определенной веб-странице. Как только я начал использовать его, я решил использовать jQuery, чтобы упростить его. Все прошло хорошо, работает script, но теперь, когда он готов, я начал задумываться о деталях.

Как часть script, мне нужно найти определенный элемент и скрыть его вместе с предыдущим и следующим его братьями и сестрами. У меня закончилась не эта читаемая, а рабочая строка:

$('div#some-weird-box').prev().toggle(w).next().toggle(w).next().toggle(w);

Меня беспокоит, что я удаляю три отдельных div в трех отдельных шагах. Это заставит браузер "перекрасить" страницу три раза, не так ли? Это не проблема с тремя div, это, вероятно, начнет иметь значение, когда будет больше элементов. Итак, мой вопрос: есть ли способ сказать браузеру "прекратить обновление/перерисовку страницы"? Если есть, я мог бы использовать это, скрыть произвольное количество элементов, а затем попросить браузер обновить экран.

Ответы

Ответ 1

Выполнение Javascript блокирует браузер, и вы не увидите перерисовку до завершения выполнения кода. Вам действительно не о чем беспокоиться.

Я опубликовал хороший пример этого на jsbin.com: http://jsbin.com/ecuku/edit

Обновление:. Часто предлагается изменять узлы за пределами DOM, поскольку изменение DOM вызывает перекосы (не перерисовывает). Reflows - это когда браузер должен пересчитывать позиции и размеры элементов на вашей странице, потому что что-то изменилось. В то время как выполнение javascript может вызвать несколько перекосов, это вызовет только одну перерисовку (когда ваш код закончится). Те перепланировки могут сильно пострадать, но для небольшого количества изменений DOM (например, ваш код имеет только 3), вероятно, не стоит делать какие-либо изменения вне страницы. Кроме того, клонирование node и изменение его за пределами страницы перед вставкой обратно могут иметь неожиданные последствия. Например, если у вас есть прикрепленные обработчики событий, их нужно будет привязать к новым узлам.

Ответ 2

Вы можете использовать cloneNode. После клонирования вы можете делать все манипуляции над клоном и замените оригинал node. Это предотвратит мигание вашего содержимого при отображении: ни один из предложенных J-P.