In order to ensure that jquery code runs all page elements or document should be loaded properly or otherwise code might not execute properly. To ensure document is loaded fully jQuery provides a method to detect this state by way of:
$(document).ready(function()
means document is ready to execute javascript/jquery code. This might be required in scenarios like hiding some data and only showing when user clicks, getting image sizes etc. This would allow your JS code to be in header section of document.
See the example below how to use it:
LIVE DEMO
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
<html>
<head>
<title>jQuery Testing</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$("p").click(function () {
$(".resultset").hide();
});
});
</script>
</head>
<body>
<p>Click here to hide resultset class below:</p>
<div class="resultset" style="background-color:yellow;">
This is Yellow line!!
</div>
</body>
</html>
|
Leave A Comment?