Селекоторы в Java Script по id, классу, имени элемента

Разберем основные методы выбора элементов в Java Script для выполнения над ними тех или иных действий. Чаще выбор по селекторам разделяют на несколько категорий - id элемента, его классу, тегу и имени. Начнем с самого простого.

Выбор по селекторов по id элемента в Java Script

Для выбора элемента по его идентификатору, надо указать его название.

Синтаксис: document.getElementById('название id')

Пример 1: (при нажатии на элемент с id myElement выходит сообщение):
<script> document.getElementById('myElement').onclick = function() {alert('Спасибо');} </script>
<input id="myElement" type="button" value="Нажми меня"/>

Пример 2:
<div id="info">Информация</div>
<script> var div = document.getElementById('info'); alert(div.innerHTML ); </script>

Выбор элемента по его классу

Данная выборка существуетв Java Script. Надо лишь правильно с ней работать, так как находил информацию вплоть до того, что такй операции не существует. На самом деле выборка по классу существует в Java Script и работает исправно. Здесь есть один нюанс - результат селектора записывается в массив. И работать уже нужно именно с массивом переменной.

Синтаксис: document.getElementsByClassName('название класса')
!! Результат возвращается всегда в виде массива

Пример 1: <script> alert(document.getElementsByClassName('ex2')[0].innerHTML);</script> //возв. 1-й найденный класс .ex2

Пример 2: (ищет количество элементов с классом article):
var articles = document.getElementsByClassName('article'); alert( articles.length );

Выбор по name элемента

Синтаксис: document.getElementsByName('имя элемента')

!! Результат возвращается всегда в виде массива

Пример: alert(document.getElementsByName('ex4')[0].innerHTML); //возв. 1-е найденное имя ex4

Выбор по названию тега элемента

Синтаксис: document.getElementsByTagName('название тэга')

!! Результат возвращается всегда в виде массива

Пример: alert(document.getElementsByTagName('span')[2].innerHTML); //возвращает 3-й найденный span