Селектор элементов jQuery

Описание: Ссылка на все плейлисты с видеоуроками по dotnet и SQL Server
   / kudvenkat  

Ссылка на слайды, примеры кода и текстовую версию видео
http://csharp-video-tutorials.blogspo...

Здоровое питание очень важно как для тела, так и для разума. Если вам нравятся рецепты Aarvi Kitchen, пожалуйста, поддержите нас, поделившись ими, подписавшись на наш канал YouTube и поставив лайк. Надеюсь, вы сможете помочь.

   / @aarvikitchen5572  

В этом видео мы обсудим селектор элементов jQuery, то есть выбор элементов по имени тега.

Для выбора элементов по имени тега используйте селектор элементов jQuery.

Синтаксис: $(element)

$('td') // Выбирает все элементы td
$('div a') // Выбирает все элементы-якоря, являющиеся потомками элемента div
$('div, span, a') // Выбирает все элементы div, span и якоря

Сообщает общее количество элементов td на странице
[script type="text/javascript"]
$(document).ready(function () {
alert($('td').length);
});
[/script]

Выбирает все элементы tr на странице и меняет их цвет фона на красный
[script type="text/javascript"]
$(document).ready(function () {
$('tr').css('background-Color', 'red');
});
[/script]

Оповещение о HTML-содержимом таблицы
[script type="text/javascript"]
$(document).ready(function () {
alert($('table').html());
});

[/script]

Оповещение о HTML-содержимом каждой строки таблицы
[script type="text/javascript"]
$(document).ready(function () {
$('table tr').each(function () {
alert($(this).html());
});
});

[/script]

Выбор и изменение цвета фона для всех элементов div, span и anchor
[script type="text/javascript"]
$(document).ready(function () {
$('div, span, a').css('background-Color', 'yellow');
});
[/script]

Выбрать все якорные элементы, являющиеся потомками элемента div
[html]
[head]
[title][/title]
[script src="jquery-1.11.2.js"][/script]
[script type="text/javascript"]
$(document).ready(function () {
$('div a').css('background-Color', 'yellow');
});
[/script]
[/head]
[body]
[div]
[a href="http://pragimtech.com"]PragimTech[/a]
[/div]
[br /]
[a href="http://microsoft.com"]Microsoft[/a]
[/body]
[/html]

Изменяет цвет фона чётных строк на серый, а нечётных — на жёлтый в обеих таблицах.
[script type="text/javascript"]
$(document).ready(function () {
$('tr:even').css('background-Color', 'gray');
$('tr:odd').css('background-Color', 'yellow');
});

[/script]

Чтобы изменить цвет фона чётных строк на серый, а нечётных — на жёлтый только для одной таблицы, используйте селектор #id вместе с селектором элемента.

[script type="text/javascript"]
$(document).ready(function () {
$('#table1 tr:even').css('background-Color', 'gray');
$('#table1 tr:odd').css('background-Color', 'yellow');
});

[/script]