JavaScript заметки

Имена тегов (кроме XHTML) всегда пишутся в верхнем регистре В браузере существуют два режима обработки документа: HTML и XML. HTML-режим обычно используется для веб-страниц. XML-режим включается, если браузер получает XML-документ с заголовком: Content-Type: application/xml+xhtml. В HTML-режиме значения tagName/nodeName всегда записаны в верхнем регистре. Будет выведено BODY вне зависимости от того, как записан тег в HTML <body> или <BoDy>. В XML-режиме регистр сохраняется «как есть». В настоящее время XML-режим применяется редко. #браузер #документ #свойства_узлов

Android Developer Кто ищет: Ubiquiti — разработчик ПО в B2B и В2С Основные требования: - 2+ года опыта разработки под Android - Владение RxJava, Kotlin, Android Studio, REST interfaces - Опыт работы с геозонами и картами Google - Уровень английского от Intermediate Где: Рига, Латвия Зарплата: от 2 500 до 6 000 EUR ➡️ Откликнуться

Тег: nodeName и tagName Получив DOM-узел, мы можем узнать имя его тега из свойств nodeName и tagName. Есть ли какая-то разница между tagName и nodeName? Да, она отражена в названиях свойств, но не очевидна. - Свойство tagName есть только у элементов Element. - Свойство nodeName определено для любых узлов Node: - - для элементов оно равно tagName. - - для остальных типов узлов (текст, комментарий и т.д.) оно содержит строку с типом узла. Другими словами, свойство tagName есть только у узлов-элементов (поскольку они происходят от класса Element), а nodeName может что-то сказать о других типах узлов. Например, сравним tagName и nodeName на примере объекта document и узла-комментария (см. картинку выше). #браузер #документ #свойства_узлов

🔥Промо-ролик нашего канала! Друзья, всем привет! Скоро нас уже будет целых две тысячи человек — солидная цифра, на которой мы не планируем останавливаться. Сегодня хотим поделиться с вами роликом для привлечения внимания к нашему комьюнити, и, надеемся, вы поделитесь им со своими знакомыми (если, конечно, оно вам понравится 🌝). Подписывайтесь на наш канал и репостите это сообщение! Напоминаем, команда нашего канала помогает российскому бизнесу и ИТ-специалистам адаптироваться к происходящему. Если у вас есть вопрос или вы хотите поделиться с нами полезной информацией — пишите нашему боту @russianhelperbot, а мы опубликуем ваш материал с указанием авторства или разберемся в вашем вопросе и подготовим пост с ответом. p.s. Вот тут удобная ссылка на youtube.

Свойство «nodeType» Свойство nodeType предоставляет ещё один, «старомодный» способ узнать «тип» DOM-узла. Его значением является цифра: - elem.nodeType == 1 для узлов-элементов, - elem.nodeType == 3 для текстовых узлов, - elem.nodeType == 9 для объектов документа, - В спецификации можно посмотреть остальные значения. В современных скриптах, чтобы узнать тип узла, мы можем использовать метод instanceof и другие способы проверить класс, но иногда nodeType проще использовать. Мы не можем изменить значение nodeType, только прочитать его. P.S. Пример с nodeType на картинке выше. #браузер #документ #свойства_узлов

Считаете себя уверенным пользователем ПК? Тогда приглашаем вас в <Компуктерную> Топовые сборки, лучшие сервисы и софты, крутые фишки и советы ждут вашего внимания 🎭 Link: https://t.me/+zIGm8lmHvBQyMWVi

Наследование классов DOM-узлов Проверить наследование можно также при помощи instanceof. Как видно, DOM-узлы – это обычные JavaScript объекты. Для наследования они используют классы, основанные на прототипах. В этом легко убедиться, если вывести в консоли браузера любой элемент через console.dir(elem). Или даже напрямую обратиться к методам, которые хранятся в HTMLElement.prototype, Element.prototype и т.д. #браузер #документ #свойства_узлов

​​Три закрытых канала для фронтендера. @build_html — сотни бесплатных макетов для верстки на русском языке. @on_the_frontend — дайджест самых актуальных статей по фронтенду. @frontend_tests — сборник задач (с их разбором) для прокачки теоретических знаний и подготовки к собеседованиям. ⚠️ Доступ открыт на 3 дня, кто успеет подписаться, останется навсегда.

Как узнать имя класса DOM-узла? Есть 2 способа сделать это: - вспомним, что обычно у объекта есть свойство constructor. Оно ссылается на конструктор класса, и в свойстве constructor.name содержится его имя - мы можем просто привести его к строке Например, для тега <body> JavaScript-класс HTMLBodyElement. #браузер #документ #свойства_узлов

Команда разработчиков Uber создала телеграм-канал, в котором на пальцах помогает новичкам освоить айти. Их главная фишка – понятные инструкции. Хотите научиться писать сайты? Держите гайд. Создавать приложения? На канале есть текстовые уроки с примерами. Кризис – лучшее время, чтобы освоить новую профессию. Залетайте в IT без напряга: @it_tochka

HTMLElement – является базовым классом для всех остальных HTML-элементов. От него наследуют конкретные элементы: - HTMLInputElement – класс для тега <input>, - HTMLBodyElement – класс для тега <body>, - HTMLAnchorElement – класс для тега <a>, …и т.д, каждому тегу соответствует свой класс, который предоставляет определённые свойства и методы. #браузер #документ #свойства_узлов

Наконец-то! Хабр официально создал телеграм-канал Хабр Community – здесь собирают отборные статьи по технологиям, новости из мира айти и фишки по кибербезопасности. Вы знаете, что делать: @habr_official

Element – это базовый класс для DOM-элементов. Он обеспечивает навигацию на уровне элементов: nextElementSibling, children и методы поиска: getElementsByTagName, querySelector. Браузер поддерживает не только HTML, но также XML и SVG. Класс Element служит базой для следующих классов: SVGElement, XMLElement и HTMLElement. #браузер #документ #свойства_узлов

Node – также является «абстрактным» классом, и служит основой для DOM-узлов. Он обеспечивает базовую функциональность: parentNode, nextSibling, childNodes и т.д. (это геттеры). Объекты класса Node никогда не создаются. Но есть определённые классы узлов, которые наследуют от него: Text – для текстовых узлов, Element – для узлов-элементов и более экзотический Comment – для узлов-комментариев. #браузер #документ #свойства_узлов

Node – также является «абстрактным» классом, и служит основой для DOM-узлов. Он обеспечивает базовую функциональность: parentNode, nextSibling, childNodes и т.д. (это геттеры). Объекты класса Node никогда не создаются. Но есть определённые классы узлов, которые наследуют от него: Text – для текстовых узлов, Element – для узлов-элементов и более экзотический Comment – для узлов-комментариев. #браузер #документ #свойства_узлов

EventTarget – это корневой «абстрактный» класс. Объекты этого класса никогда не создаются. Он служит основой, благодаря которой все DOM-узлы поддерживают так называемые «события», о которых мы поговорим позже. P.S. На картинке описание интерфейса на TypeScipt. #браузер #документ #свойства_узлов

Эпичная коллекция говнокода. Элитные костыли и велосипеды от 300кк/сек сеньоров на канале @shitty_code

Классы DOM-узлов У разных DOM-узлов могут быть разные свойства. Например, у узла, соответствующего тегу <a>, есть свойства, связанные со ссылками, а у соответствующего тегу <input> – свойства, связанные с полем ввода и т.д. Текстовые узлы отличаются от узлов-элементов. Но у них есть общие свойства и методы, потому что все классы DOM-узлов образуют единую иерархию. Каждый DOM-узел принадлежит соответствующему встроенному классу. Корнем иерархии является EventTarget, от него наследует Node и остальные DOM-узлы. На рисунке выше изображены основные классы. #браузер #документ #свойства_узлов

​Совет от создателя Google: учите программирование. Айтишник даже на cтарте получает от $2000. А хороших спецов настолько мало, что платить готовы даже чайникам. Пока 90% людей думают, это сложно, читайте канал IT Helper. Python, C++, Java – здесь вы на изи выучите любой язык и вольетесь за 2-3 недели. Ребята собрали самое важное и оформили в понятные картинки, поэтому даже у гуманитариев проблем нет. Подписывайтесь, чтобы через месяц выбирать между зарплатой в $2000 или $3000: @ithelper

Итого по поиску в DOM Есть 6 основных методов поиска элементов в DOM (см. изображение выше). Безусловно, наиболее часто используемыми в настоящее время являются методы querySelector и querySelectorAll, но и методы getElement(s)By* могут быть полезны в отдельных случаях, а также встречаются в старом коде. Кроме того: - Есть метод elem.matches(css), который проверяет, удовлетворяет ли элемент CSS-селектору. - Метод elem.closest(css) ищет ближайшего по иерархии предка, соответствующему данному CSS-селектору. Сам элемент также включён в поиск. И, напоследок, давайте упомянем ещё один метод, который проверяет наличие отношений между предком и потомком: - elemA.contains(elemB) вернёт true, если elemB находится внутри elemA (elemB потомок elemA) или когда elemA==elemB. #браузер #документ #поиск