Публикации по теме '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..