Публикации по теме 'dom-manipulation'


Создание глупых вещей: смена цвета фона с помощью setInterval
В духе Ощутить радость от создания крошечных программ и создания глупой хрени вот супер-крошечная вещь, которую вы можете сделать менее чем за 15 минут. Это просто страница, которая каждую секунду меняет цвет фона на случайный цвет. Вот демо-версия того, что мы строим. https://yarocruz.github.io/colours/ Настройка Откройте терминал или командную строку и создайте два файла: touch index.html app.js Откройте эти три файла в своем любимом тексте или, если у вас есть..

Путаница с кнопками, JokeAPI и fetch()
Сценарий Недавно я обнаружил склонность включать пасхальные яйца и другие скрытые жемчужины в проекты кодирования, чтобы люди могли их найти или наткнуться. Когда мне поручили проект, одним из основных результатов было использование моих новых знаний о vanilla JavaScript и fetch() для выполнения GET запроса к API. Просматривая бесплатные API для использования, я наткнулся на JokeAPI и понял, что каким-то образом мне нужно реализовать его в качестве бонуса. После того, как основные..

Игра прорыва на JavaScript
Давайте создадим клон классической консольной игры Breakout. В игре будет три ряда по шесть блоков в каждом. Когда мяч попадает в блок, он лопается и исчезает. Вот что нам нужно сделать: Создайте контейнер для блоков Создайте блоки и визуализируйте их внутри контейнера. Сохраняйте координаты каждого блока, чтобы мы могли проверить на столкновение Стартовый HTML и CSS Давайте начнем с базового HTML-кода в файле с именем index.html , как показано ниже: <!DOCTYPE HTML>..

Понимание манипуляции с DOM в Angular
Если вы начинаете работать с angularjs, вам было довольно просто получить доступ к DOM и управлять им там. У вас был доступ к узлу DOM через element , введенный в link функцию директивы. function link(scope, element , attrs) { } Или через angular.element , который был встроенным подмножеством jQuery в AngularJS. Но у этого подхода были свои недостатки. Это сделало ваш код тесно связанным с API браузера. Новый Angular (начиная со 2) работает на нескольких платформах: мобильных,..

Изучите jQuery простым способом?
Что такое jQuery: Согласно Википедии, «jQuery - это библиотека JavaScript, разработанная для упрощения обхода и манипулирования деревом HTML DOM». Цель jQuery - упростить использование JavaScript на вашем веб-сайте. Что вы уже должны знать: Прежде чем приступить к изучению jQuery, вы должны иметь базовые знания в следующих областях: HTML CSS JavaScript Сначала добавьте ссылку на jQuery (установите jquery) загрузите jquery и добавьте его в HTML, или, Добавить jquery..

Тонкие различия между .innerText, .textContent и innerHTML в JavaScript
"Внутренний" вид На первый взгляд .innerHTML, .textContent и .innerText выглядят очень похоже при манипулировании элементами DOM в JavaScript. Хотя похоже, что вы выполняете свою задачу, вы можете оставить свой сайт открытым для уязвимостей, даже не подозревая об этом. .innerText и .textContent Эти два элемента, кажется, делают одно и то же на поверхности, но действуют немного по-разному в DOM. Свойство .innerText представляет обработанный текст в элементе HTML, а свойство..

Очистить Div с помощью DOM в JavaScript
Когда я начал работать с JavaScript, одной из моих главных проблем было «Как очистить часть страницы и отобразить другой контент», тогда я начал искать способ сделать это, позвольте мне представить вам способ, который я нашел для очистки страницы, которая в основном удаляет основной дочерний элемент div. Прежде всего, нам нужно создать базовый HTML-скеллетон с div, как показано ниже: ‹html› ‹голова›‹голова› ‹div id="основной контейнер"› ‹/div› ‹script..