Jquery обратиться к тегу дерева Dom

Обратиться к элементу в jquery. Когда мы говорим об обращении к элементу, что имеется ввиду? Обращение к элементу, если по простому, то это: обратиться к тегу!

Сколько способов существует обратиться к тегу используя jquery?

Подробно об удалении тегов/блоков/элементов в jquery

1. Обращаемся к элементу с помощью jquery id
2. Обратимся элементу с помощью jquery class
3. Обратимся элементу с помощью jquery name
4. Обращаемся к элементу с помощью jquery (tagname)

Обращаемся к элементу с помощью jqueryid

Естественно, что все способы обратиться к тегу(элементу) будут работать если подключить jquery

Первый способ обратиться к элементу в jquery с помощью id. Чтобы не разводить скучную теорию создадим живые примеры во всех пунктах.

Само обращение к элементу в jquery с помощью id... пишется знак доллара и внутри прописываем знак атрибута, в данном случае это решетка #. Далее идет точка и присоединяется другая конструкция, которая будет производить заданное действие с этим элементом:

$('#refer_id')

Далее нам понадобится...

Создадим какой-то элемент Dom - пусть это будет div, в него поместим уникальный id

<div id="refer_id">Здесь текст, который будет заменен при обращении к данному элементу!</div>

Далее нам понадобится кнопка... button, добавим туда onclick, повесим прямо на кнопку, с вызовом функцию(referToElementById) :

<button onclick="referToElementById();">button</button>

Далее напишем функцию, в которой обратимся к элементу с помощью jquery и id. Чтобы увидеть какое-то действие... :

<script>
function referToElementById() {
$('.refer_id').text('Привет мир');
}
</script>

Соберем код для обращения к элементу в jquery с помощью id


<div id="refer_id">Здесь текст, который будет заменен при обращении к данному элементу!</div>

<button onclick="referToElementById();">Обратись к элементу jquery с помощью id</button>

<script>
function referToElementById() {
$('#refer_id').text('Привет мир');
}
</script>

Результат обращения к элементу в jquery с помощью id

Для того, чтобы увидеть процесс обращения к тегу, нажмите кнопку - "Обратись к элементу jquery с помощью id". если что-то произойдет, то это подтвердит, что мы смогли обратиться к элементу!

Здесь текст, который будет заменен при обращении к данному элементу!
Обратись к элементу jquery с помощью id



Обратимся элементу с помощью jqueryclass

Следующий способ обращения к элементу - это обращение к лассу в jquery.

Обращение к классу происходит таким образом... пишется знак доллара, скобки внутри прописывается знак класса - это точка. После присоединяется конструкция для манипуляции с элементом.

$('.refer_class')

Рассмотрим живой пример обращения к тегу через класс в jquery

Для этого примера нам понадобится:

Создадим тег с классом :

<div class="refer_class">Здесь элемент с классом. Будем обращаться к нему через jquery </div>

Далее нам понадобится кнопка + onclick + функция:

<button onclick="referToElementByClass();">Обратись к элементу в jquery с через класс</button>

Далее напишем функцию, в октрой обратимся к элементу и добавим ему какое-то новое совйство :

<script>
function referToElementByClass() {
$('.refer_class').style('color:red');
}
</script>

Пример скрипта по обращению к элементу через класс в jquery

Здесь элемент с классом. Будем обращаться к нему через jquery.
Обратись к элементу в jquery с через класс



Обратимся элементу с помощью jqueryname

Способ обращения... пишется знак доллара и далее...

$('input[name="refer_name"]')

input можно не писать, можно написать вот так(тоже будет работать):

$('[name="refer_name"]')

Для того, чтобы обратиться к nue по его имени "NAME" нам понадобится input.

<input name="refer_name" value="Здесь доказательство обращения к тегу через name">

Далее опять кнопка:

<button onclick="referToElementByName();">Обратись к элементу в jquery с через name</button>

И опять функция:

<script>
function referToElementByName() {
$('input[name="refer_name"]').val('Новое значение');
</script>
}

Если что-то изменится в нашем элементе, значит обращение к элементу в jquery прошло удачно!

Пример обращения к тегу в jquery через атрибут name

Обратись к элементу в jquery с через name



Обращаемся к элементу с помощью jquery(tagname)

Синтаксичний обращения к тегу в jquery... пишется знак доллара и далее... внутри скобок пишется название тега, к которому будем обращаться :

$('anytagname')

Создаем тег:

<anytagname>Здесь текст и по нему будет видно -смогли ли мы обратиться к данному тегу!</anytagname>

Кнопка:

<button onclick="referToElementByTagname();">Обратись к элементу в jquery с через tagname</button>

Функция:

<script>
function referToElementByTagname() {
$('anytagname').text('Да мы изменили это!');
}
</script>


Обратись к тегу через jquery к tagname

Здесь текст и по нему будет видно -смогли ли мы обратиться к данному тегу!
Обратись к элементу в jquery с через tagname