Одной командой document.write(((Array.from(document.getElementsByTagName("a"))).map(i => {return i.href})).join("<br>")) Куда вводить эту команду? Открываете HTML-страницу, с которой хотите получить все ссылки. Включаете «Инструменты разработчика» в браузере (CTRL + SHIFT + i). Находите вкладку «Console«. Тыкаете курсор в белое поле справа от синей стрелочки. Вставляете команду. Жмёте ENTER. Для тех кто не понял предлагаю […]
FrontEND
85 записей
В этой публикации мы постараемся разобраться в том, как дотянуться до заветных данных при помощи JavaScript и метода fetch(input, init) Мы по шагам будем погружаться в выборку и смотреть полученные итерации на каждом шаге, чтобы не запутаться и не пропустить важное. Задача Нужно получить простую HTML-разметку из файла text.html. Нужно […]
YouTube умеет показывать субтитры, а ещё он умеет переводить субтитры на любой язык. Меня интересовало получение полноценного связного текста перевода для видеоролика. Задача Нужно получить полноценный «очищенный» текст силами JavaScript и инструментами разработчика в браузере. Никаких редакторов кода. 1. Получение файла субтитров Для начала откроем нужный нам видеоролик и включим […]
Обещание (Promise) — это объект, который используется в качестве заполнителя для возможных результатов отложенного (и, возможно, асинхронного) вычисления. Обещание (Promise) принадлежит к разделу «Управляемые Объекты Абстракции» (Control Abstraction Objects) Состояния объектов Promise Любой объект Promise находится в одном из трех взаимоисключающих состояний: fulfilled — (выполнено) rejected — (отклонено) pending — […]
Когда мы используем метод getElementsByTagName() интерфейса Document, мы получаем массиво-подобный объект интерфейса HTMLCollection. В чём тут проблема? Для коллекции HTML-элементов невозможно применить методы массивов, например метод map(). То есть если мы хотим пройтись по каждому элементу объекта HTMLCollection и шаблонно внести преобразования, то у нас ничего не получится т.к. в этом […]
На первых порах изучения JavaScript бывают непонятны отличительные черты некоторых свойств объектов. Например, в инструментах разработчика не всегда можно понять разницу между innerText и innerHTML. Такое бывает из-за одинакового строкового содержимого в этих свойствах у элемента. Так в чём же различие? innerText — показывает всё текстовое содержимое, которое не относится […]
Версия документа от 18 августа 2020 года. Ссылка на оригинальную версию документа https://w3c.github.io/FileAPI/ Аннотация Эта спецификация предоставляет API для представления файловых объектов в веб-приложениях, а также для их программного выбора и доступа к их данным. Это включает: Интерфейс FileList, который представляет собой массив индивидуально выбранных файлов из базовой системы. Пользовательский […]
onclick — это обработчик события click — это событие В чём концептуальная разница? Обработчик события (onclick) мы вешаем на элемент в котором хотим поймать совершённое событие клика. То есть когда пользователь нажмёт на картинку в документе, мы сделаем красную рамку (например). То есть мы поправим стили оформления документа для элемента […]
Оглавление Вводные данные Задача Предпосылки. Зачем это нужно? Решение задачи Логика работы объекта XMLHttpRequest Результат работы Полезные ссылки Вводные данные Есть два файла на сервере: index.html text.html Файл index.html обрабатывается силами web-сервера и автоматически загружается в браузер пользователя при обращении к сайту (главной странице). Файл index.html имеет классическую разметку документа: […]
У нас есть два массива. В первом массиве перечислены женские имена. Во втором массиве перечислены мужские имена. Массив № 1 var namesFemale = [ "Елена" , "Светлана" , "Татьяна" , "Диана" ] Массив № 2 var namesMale = [ "Пётр" , "Алексей" , "Максим" , "Иван" ] Задача Мы хотим […]
(function () { // тело функции }()); Второй вариант (function () { // тело функции })(); Третий вариант function () { // тело функции }();
Простыми словами Простыми словами, массив — это набор элементов и их значений, в котором каждый элемент логически связан со всеми остальными. Понимание необходимости создания массивов данных. Пример из жизни Перед вами листок бумаги. Вы смотрите на него. Представьте, что в ваш мозг поступают данные с листка в таком виде: 4562 […]
Версия стандарта от 06 августа 2020 г. Принимать участие: GitHub whatwg / fetch (новый выпуск, открытые выпуски) IRC: #whatwg на Freenode Фиксации: GitHub whatwg / fetch / commits Снимок с этого коммита @fetchstandard Тесты: web-platform-tests fetch / (текущая работа) Переводы (ненормативные): 日本語 Аннотация Стандарт Fetch определяет запросы, ответы и процесс, […]
Тип события клавиатуры compositionstart Интерфейс CompositionEvent Синх / Асин Синхронный Всплытие Да Надежные цели Element Отменяемый Да Сдержанный Да Действие по умолчанию Начинает новый сеанс композиции, когда включена система композиции текста Контекст (доверенные события) Event.target : сфокусированный элемент обработки композиции UIEvent.view : Window UIEvent.detail : 0 CompositionEvent.data : исходная редактируемая […]
События композиции предоставляют средства для ввода текста дополнительным или альтернативным способом, а не событиями клавиатуры, чтобы разрешить использование символов, которые могут быть недоступны на клавиатуре. Например, события композиции могут использоваться для добавления акцентов к символам, несмотря на их отсутствие на стандартных клавиатурах США, для создания логограмм многих азиатских языков из […]
Тип события клавиатуры keyup Интерфейс KeyboardEvent Синх / Асин Синхронный Всплытие Да Надежные цели Element Отменяемый Да Сдержанный Да Действие по умолчанию Не определено Контекст (доверенные события) Event.target : фокусируемый элемент, обрабатывающий ключевое событие, или если элемент не сфокусирован, то элемент body, если доступен, в противном случае корневой элемент UIEvent.view […]
Тип события клавиатуры keydown Интерфейс KeyboardEvent Синх / Асин Синхронный Всплытие Да Надежные цели Element Отменяемый Да Сдержанный Да Действие по умолчанию Варьируется: события «перед входом» beforeinput и «вход» input; запустить систему компоновки текста; blur и focus события; событие «нажатия клавиши» keypress (если поддерживается); активационное поведение; другое событие Контекст (доверенные […]
События клавиатуры зависят от устройства, то есть зависят от возможностей устройств ввода и от того, как они отображаются в операционных системах. keydown keyup Тип события клавиатуры — keydown Тип события клавиатуры keydown Интерфейс KeyboardEvent Синх / Асин Синхронный Всплытие Да Надежные цели Element Отменяемый Да Сдержанный Да Действие по умолчанию […]
Тип события мыши input Интерфейс InputEvent Синх / Асин Синхронный Всплытие Да Надежные цели Element (в частности: типы элементов управления, такие как HTMLInputElement и т. д.) Или любой Element с включенным атрибутом «contenteditable» Отменяемый Нет Сдержанный Да Действие по умолчанию Не назначено Контекст (доверенные события) Event.target : цель события, которая […]
Тип события мыши beforeinput Интерфейс InputEvent Синх / Асин Синхронный Всплытие Да Надежные цели Element (в частности: типы элементов управления, такие как HTMLInputElement и т. д.) Или любой Element с включенным атрибутом «contenteditable» Отменяемый Да Сдержанный Да Действие по умолчанию Обновление элемента DOM Контекст (доверенные события) Event.target : цель события, […]