JavaScript #6: создание и добавление элементов DOM createElement, append, remove, insertAdjacentHTML
ฝัง
- เผยแพร่เมื่อ 25 ม.ค. 2020
- Инфо-сайт: proproprogs.ru
Создание элементов DOM-дерева: createElement, createTextNode. Добавление элементов в HTML-документ: append, prepend, before, after, replaceWith, cloneNode. Вставка фрагмента HTML в документ - insertAdjacentHTML. Специализированные методы вставки: insertAdjacentText, insertAdjacentElement. Работа с DocumentFragment. Метод document.write.
Отличный материал! После непонятной 3хчасовой лекции в обучающем центре, с помощью этого видео разобрался во всем за 20 минут.
Вообще супер подача! Без лишней болтовни и речь поставлена!
Я вообще только сейчас понял какие элементы устаревшие, а какие нет. Я использовал половину новых и половину старых :) Спасибо.
огромное спасибо за примеры. Все чётенько и понятненько.
Оч хороший глубокий урок. Спасибо
Классный урок, много практических вещей!
Великолепный урок. Большое спасибо!
It is really understandable content for beginners! Many thanks for the Great Job you done!
Спасибо. Отличньіе уроки. все понятно.!!!!
Хоть метод document.wire() и устаревший но мне кажется его вполне можно применять в качестве средства защиты от парсинга)))
Очень качественный контент, за такое нужно платить!
Да, я думаю он должен платить Илье Кантору за то, что использует его материал. Источник то он даже не указывает.
@@morphpurple6842 да это же плюс, что используется Канторовская основа! Прочел глазами, закрепил через аудио, прекрасно )
@@morphpurple6842 Илья Кантор наверное придумал это язык. Как Тема Лебедев придумал дизайн. Такие персонажи всегда обвалакивают себя легендами.
Отличный урок, спасибо!
Спасибо за понятное объяснение.
Спасибо за уроки:3
Видосик четкий!
Огромное спасибо!
Спасибо!
Красавчик
12:30 стоит отметить, что append вызывает каждый раз перерисовку страницы браузером, а это трудоемкий процесс, и, все таки, лучше добавить несколько элементов за один раз
не, был не прав. браузер оптимизирует вставку элементов. В случае цикла, append не каждый раз вызывает перерисовку, браузер добавляет на страницу все элементы за один раз.
добавим к примеру кнопку, по нажатию которой запускается цикл.
const btn = document.querySelector('button')
btn.onclick = () => {
const ul = document.querySelector('ul')
const list = ['a', 'б', 'в', 'г']
for (let l of list) {
let item = document.createElement('li')
item.textContent = l
ul.append(item)
alert(l)
console.log(l)
console.log(item)
}
}
сначала срабатывает окно алерта и в консоль выводятся буквы, оставляя при этом место под элементы, и когда цикл отрабатывает все элементы сразу же отображаются в консоли на своих местах.
Спосибо, Я подписал на 2 канал
СПС
отличное объяснение, спасибо 🤝 (p.s. только пож-та - не "ява-скрипт" !!! 😄, java читается и произносится в англ.яз как "джава") 😉
спасибо, но можно и так и так )
@@selfedu_rus )) ну нельзя же😄режет слух! но всё равно спасибо за контент🦾🤗
питон или пайтон?
Ошибка в after и before, напутал. В скрине одно, в коде другое. А объяснении третье!
Начиная с 6:30
да, есть немного, но из примера дальше все должно быть ясно
Добрый день! Почему методы устаревают?
respect
Мне больше вот что интересно, как защитить это от XSS атаки
А что это
Почему вы не упомянули крайне функциональный метод html() ?
Это метод библиотеки jQuery или вы имеете в виду innerHTML? О последнем рассказывается на одном из занятий.
@@selfedu_rus Да, действительно, это метод jQuery. Запамятовал, прошу прощения !
А вот это а вот тут а вот так
Хопа