• Страница 1 из 1
  • 1
Форум » II.jQuery » Базовое знакомство с jQuery » Работа с содержимым страниц с помощью JavaScript (Модификация веб-страниц, DOM)
Работа с содержимым страниц с помощью JavaScript
1 Язык JavaScript можно использовать для манипулирования веб-страницей, добавления нового контента, изменения HTML-кода страницы и применения CSS-стилей к элементам страницы.

Но, чтобы вы ни делали из вышеперечисленного, вы всегда выполняете следующие действия: выбор элемента на странице и выполнение действий с этим элементом.

Какие действия можно произвести с выбранным элементом?

- изменить свойства элемента

- добавить новое содержимое

- удалить элемент

- получить информацию об элементе

- добавить или удалить атрибут класса

Изменить / Удалить

2 Объектная модель документа (DOM)

Представление веб-страницы, при котором браузер запоминает все HTML-элементы, их атрибуты и порядок, в котором они появляются на странице, называется объектной моделью документа (сокращенно DOM, Document Object Model)

Что даёт DOM? Он даёт для JavaScript информацию для взаимодействия с элементами на веб-странице, позволяет обмениваться информацией с веб-страницей и изменять её HTML-код.

Объектная модель документа считает все элементы(теги) на странице, атрибуты и текст отдельными единицами - узлами.

Изменить / Удалить

3 Способы выбора элементов DOM на странице с помощью JavaScript

Метод выбора элемента по его идентификатору

Код
document.getElementById();


данный метод позволяет выбрать элемент на странице, которого есть назначенный идентификатор. Например, есть блок с идентификатором banner:

Код
<div id = 'banner'>
/* здесь содержимое блока */
</div>


тогда выбрать этот блок можно так:

Код
document.getElementById('banner');


Метод выбора конкретных элементов по названию тега

например, чтобы выбрать все элементы привязки(ссылки) на странице:

Код
document.getElementsByTagName('a');


Метод выбора элементов на основе CSS селекторов

например, чтобы выбрать все элементы на странице с классом 'active':

Код
document.getElementsByClassName('active');


чтобы выбрать все элементы span с классом 'author':

Код
document.querySelectorAll('span.author');

Изменить / Удалить

Форум » II.jQuery » Базовое знакомство с jQuery » Работа с содержимым страниц с помощью JavaScript (Модификация веб-страниц, DOM)
  • Страница 1 из 1
  • 1
Поиск: