Закрыть
×
dir.by
Праздники ...
Праздники ...
Праздник весны и труда (1 мая)
Концерты, выставки ...
Концерты, выставки ...
Крупнейшее рекламное шоу в мире "Ночь пожирателей рекламы"|||г. Минск 29 мая 2026
Афишу
Спорт занятия ...
Спорт занятия ...
Фитнес для подростков 10-15 лет
Спорт занятие
Компьютер, программы...
Компьютер, программы...
Объявления ...
Объявления ...
Детская гимнастика в Минске
Объявление
Форум ...
Форум ...
обсуждение...
Поиск
Концерты
Спорт
Форум
Компьютер
Компьютер, программы
→
jQuery - JavaScript библиотека для удобной работы с HTML
Событие html страница открылась. jQuery
посмотрели
5825
раз
обновлено: 22 ноября 2018
jQuery
предлагает несколько способов когда html страница открылась (документ HTML DOM готов для использования):
способ 1
$(
handler
);
На заметку!
handler - ваша функция
JavaScript
Пример
$(
function
()
{
alert
(
"Hello"
);
}
);
способ 2
$( document ).ready(
handler
);
На заметку!
handler - ваша функция
JavaScript
Пример
$( document ).ready(
function
()
{
alert
(
"Hello"
);
}
);
способ 3
$( "document" ).ready(
handler
);
На заметку!
handler - ваша функция
JavaScript
Пример
$(
"document"
).ready(
function
()
{
alert
(
"Hello"
);
}
);
способ 4
$( "img" ).ready(
handler
);
На заметку!
handler - ваша функция
JavaScript
Пример
$(
"img"
).ready(
function
()
{
alert
(
"Hello"
);
}
);
способ 5
$().ready(
handler
);
На заметку!
handler - ваша функция
JavaScript
Пример
$().ready(
function
()
{
alert
(
"Hello"
);
}
);
Пример (используем способ 1)
Html
<html>
<body>
<!-- подключаем библиотеку jQuery -->
<script
src=
"https://dir.by/example_lib/jquery/jquery-3.3.1.min.js"
></script>
<!-- страница открылась -->
<script>
$(
function
() {
alert
(
"Hello"
);
});
</script>
</body>
</html>
Когда страница откроется, мы увидим сообщение "Hello"
← Предыдущая тема
Примеры jQuery
Следующая тема →
Найти элемент по ID в jQuery. Пример: $("#Название")
Ваши Отзывы ... комментарии ...
Вашe имя
Ваш комментарий
(www ссылки может добавлять только залогиненный пользователь)
+ картинку
Экскурсии по Москве: пешеходные, автобусные и речные прогулки на любой вкус
Анонс!
Ярмарка вакансий для молодежи, работа (учащихся, которые хотели бы подработать в свободное время, а также выпускники)|||Минск, Витебск, Гомель, Гродно, Могилев, Борисов, Полоцк, Брест, Барановичи, Пинск с 13 по 17 апреля 2026
Объявления
Объявления
•
Что такое JQuery ?
•
jQuery где скачать и как подключить?
•
Создаем новое приложение с jQuery
•
Примеры jQuery
•
Событие html страница открылась. jQuery Пример: $(function () {...}); или $( document ).ready(function() { ... });
найти один элемент по ID
•
Найти элемент по ID в jQuery. Пример: $("#Название")
найти много элементов по списку ID
найти элемент по: tag, attribute, class
•
Поиск элемента (элементов) по имени атрибута в jQuery. Пример HTML: <div color='green'>Hello!</div> Пример jQuery: var elem = $("[color]");
•
Найдите элемент по атрибуту и значению атрибута в jQuery. Пример: $("[my='123a']")
перебрать все элементы с нужным классом
•
Перебрать все элементы | each | в jQuery. Пример: $('.book').each(function(i, elem) { /*to do something*/ });
элемент (показать/спрятать)
•
Показать / спрятать элемент в jQuery. Пример: $("#Название").show()
class (добавить/удалить у элемента)
•
Добавить / удалить class в jQuery. Пример: $("#Название").addClass("my"); $("#Название").removeClass("my");
содержимое у элемента (поменять/брать)
•
Поменять содержимое у элемента в jQuery. Пример: $("#Название").html("Good morning");
•
Взять содержимое у элемента в jQuery. Пример: $("#Название").html();
значение для аттрибута (поменять/брать)
•
Поменять значение для аттрибута в jQuery. Пример: $("#Название").attr("aaa", "Hello"); $("#Название").removeAttr("aaa");
•
Взять значение у аттрибута в jQuery. Пример: $("#Название").attr("aaa");
значение для свойства DOM-объекта (поменять/брать)
•
Поменять свойство DOM-объекта в jQuery. Пример: $("#Название").prop("eee", "Hello");
•
Взять свойство DOM-объекта в jQuery. Пример: $("#Название").prop("eee");
значение checkbox (поменять/брать)
•
Поменять значение для checkbox в jQuery. Пример: $("#Название").prop('checked', true);
•
Взять значение checkbox в jQuery. Пример: $("#Название").prop('checked');
CSS стили для элемента
•
Поменять CSS стиль у элемента в jQuery. Пример: $("#Название").css("color", "#cc0000");
•
Взять CSS стиль у элемента в jQuery. Пример: var value1 = $("#Название").css("color");
Создание элемента
•
insertAfter | Вставляем новый контент HTML после нужного элемента в jQuery. Пример: $("<font color='green'>my text</font>").insertAfter($("#div1"));
•
append | Создание элемента HTML в конец блочного элемента в jQuery. Пример: $("body").append("<font color='green'>my text</font>")
value для элемента (поменять/брать)
•
Поменять value для HTML элемента в jQuery. Пример: $("#Название").val("Hello");
•
Взять value у HTML элемента в jQuery. Пример: var value1 = $("#Название").val();
выбрать элемент из списка по индексу
•
в jQuery выбрать HTML option из HTML select. Выбрать по индексу, value. Пример: $("#myColors").prop('selectedIndex', 2);
•
в jQuery взять value, индекс из активного HTML option. Пример1: var value = $("#myColors").val(); Пример 2: var index = $("#myColors").prop('selectedIndex');
enable / disable
•
Enable / disable для HTML элемента в jQuery. Пример enable: $("#Book").removeAttr("disabled"); Пример disable: $("#Book").attr("disabled", "disabled");
Послать запрос ajax
•
Отправить ajax запрос | jQuery. Пример: $.ajax({ type:"POST", url:"...", data:{...}}, success: function(msg) { ... } });
•
Событие, когда ajax Запрос завершен | jQuery. Пример: $(document).ajaxStop(function () { ... });
Событие
обработка события click
•
Событие когда нажимаем левой кнопкой мыши на элемент | click | jQuery | Пример: $("#Название").click(function(event) { ... });
•
Обработать событие click для всех элементов | jQuery. Пример: $(document).on("click", function(event){ ... });
обработка события submit
•
Событие когда в вашей форме нажимаем на кнопку "submit" | jQuery. Пример: $("#Ваша Form ID").submit( function() { ... } );
Дополнительные темы, вопросы
•
jQuery.fn и jQuery.prototype это тоже самое
WWW сайты для изучения JQuery
•
Сайты для изучения JQuery
Ваши вопросы присылайте по почте:
info@dir.by
Афишу
Ваши Отзывы ... комментарии ...