Закрыть
×
dir.by
Праздники ...
Праздники ...
Международный день защиты детей (1 июня)
Концерты, выставки ...
Концерты, выставки ...
Музыкальная комедия "Невеста из Имеретии"|||г. Минск 10 марта, 26 мая, 12 июля 2026
Афишу
Спорт занятия ...
Спорт занятия ...
Фитнес (Аэробика, Стретчинг, Йога, Strip Dance)
Спорт занятие
Компьютер, программы...
Компьютер, программы...
Объявления ...
Объявления ...
Распродажа коврики-пазлы!!!
Объявление
Новости ...
Новости ...
Форум ...
Форум ...
обсуждение...
Поиск
Концерты
Спорт
Форум
Компьютер
Компьютер, программы
→
jQuery - JavaScript library for convenient work with HTML
Event html the page has opened. jQuery
посмотрели
6139
раз
обновлено: 22 November 2018
jQuery
suggests several ways when html the page has opened (document HTML DOM ready to use):
method 1
$(
handler
);
Note!
handler - your function
JavaScript
Example
$(
function
()
{
alert
(
"Hello"
);
}
);
method 2
$( document ).ready(
handler
);
Note!
handler - your function
JavaScript
Example
$( document ).ready(
function
()
{
alert
(
"Hello"
);
}
);
method 3
$( "document" ).ready(
handler
);
Note!
handler - your function
JavaScript
Example
$(
"document"
).ready(
function
()
{
alert
(
"Hello"
);
}
);
method 4
$( "img" ).ready(
handler
);
Note!
handler - your function
JavaScript
Example
$(
"img"
).ready(
function
()
{
alert
(
"Hello"
);
}
);
method 5
$().ready(
handler
);
Note!
handler - your function
JavaScript
Example
$().ready(
function
()
{
alert
(
"Hello"
);
}
);
Example (use method 1)
Html
<html>
<body>
<!-- connect the library jQuery -->
<script
src=
"https://dir.by/example_lib/jquery/jquery-3.3.1.min.js"
></script>
<!-- the page has opened -->
<script>
$(
function
() {
alert
(
"Hello"
);
});
</script>
</body>
</html>
When the page opens, we will see a message "Hello"
← Previous topic
Examples jQuery
Next topic →
Find Item by ID in the jQuery. Example: $("#Name")
Your feedback ... Comments ...
Your Name
Your comment
(www links can only be added by a logged-in user)
+ Picture
Экскурсии по Москве: пешеходные, автобусные и речные прогулки на любой вкус
Объявления
Объявления
•
What the JQuery ?
•
jQuery where to download and how to connect?
•
Create a new application with jQuery
•
Examples jQuery
•
Event html the page has opened. jQuery Example: $(function () {...}); or $( document ).ready(function() { ... });
find one item by ID
•
Find Item by ID in the jQuery. Example: $("#Name")
find many items in the list ID
Find Item by: tag, attribute, class
•
Find the element (elements) by attribute name in the jQuery. HTML example: <div color='green'>Hello!</div> Example of jQuery: var elem = $("[color]");
•
find the element by attribute and attribute value in the jQuery. Example: $("[my='123a']")
iterate through all the elements with the desired class
•
Iterate through all items | each | in the jQuery. Example: $('.book').each(function(i, elem) { /*to do something*/ });
element (show/hide)
•
Show/hide item in the jQuery. Example: $("#Name").show()
class (add/remove from an item)
•
Add/Remove class in the jQuery. Example: $("#Name").addClass("my"); $("#Name").removeClass("my");
content of the element (change/take)
•
Change the content of an element in the jQuery. Example: $("#Name").html("Good morning");
•
Take content from an item in the jQuery. Example: $("#Name").html();
value for attribution (change/take)
•
Change the value for the attribute in the jQuery. Example: $("#Name").attr("aaa", "Hello"); $("#Name").removeAttr("aaa");
•
Take the value from the attribution in the jQuery. Example: $("#Name").attr("aaa");
value for the DOM object property (change/take)
•
Change the property of a DOM object in the jQuery. Example: $("#Name").prop("eee", "Hello");
•
Take a property of the DOM object in the jQuery. Example: $("#Name").prop("eee");
meaning checkbox (change/take)
•
Change the value for checkbox in the jQuery. Example: $("#Name").prop('checked', true);
•
Take value checkbox in the jQuery. Example: $("#Name").prop('checked');
CSS styles for an element
•
Change the CSS style of an element in the jQuery. Example: $("#Name").css("color", "#cc0000");
•
Take CSS style of the element in the jQuery. Example: var value1 = $("#Name").css("color");
Create an item
•
insertAfter | Insert new content HTML after the desired element in the jQuery. Example: $("<font color='green'>my text</font>").insertAfter($("#div1"));
•
append | Create an item HTML to the end of the block element in the jQuery. Example: $("body").append("<font color='green'>my text</font>")
value for an item (change/take)
•
Change value for HTML element in the jQuery. Example: $("#Name").val("Hello");
•
Take value you have an HTML element in the jQuery. Example: var value1 = $("#Name").val();
select an item from the list by index
•
In the jQuery choose HTML option from HTML select. Select by index, value. Example: $("#myColors").prop('selectedIndex', 2);
•
In the jQuery take value, index from active HTML option. Example1: var value = $("#myColors").val(); Example 2: var index = $("#myColors").prop('selectedIndex');
enable / disable
•
Enable / disable for HTML element in the jQuery. Example of enable: $("#Book").removeAttr("disabled"); Disable example: $("#Book").attr("disabled", "disabled");
Send a request ajax
•
Send ajax query | jQuery. Example: $.ajax({ type:"POST", url:"...", data:{...}}, success: function(msg) { ... } });
•
Event when ajax query has been finished | jQuery. Example: $(document).ajaxStop(function () { ... });
Событие
handling the click event
•
Event when we click the left mouse button on the element | click | jQuery | Example: $("#Name").click(function(event) { ... });
•
Handle event click for all elements | jQuery. Example: $(document).on("click", function(event){ ... });
event handling submit
•
Event when on your form press the button "submit" | jQuery. Example: $("#Your Form ID").submit( function() { ... } );
Additional topics, questions
•
jQuery.fn and jQuery.prototype it's the same thing
WWW sites to explore JQuery
•
Sites to explore JQuery
Ваши вопросы присылайте по почте:
info@dir.by
Афишу
Your feedback ... Comments ...