Most jQuery-specific code needs to be set up within a document.ready() event handler method. But native JavaScript such as variables, arrays, and so on can be set up outside of the document ready event handler because they don't need to wait for the DOM to be ready and are hidden from the DOM as they are specifics within the actual script.
The following code example outlines a script that relies on the DOM to be loaded before new content can be added. There are three variables being set in this script — two of them outside of the document.ready() event and one being set inside for the document.ready() event as it needs access to the for loop set up inside on it.
<!doctype html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></
script>
<script>
var numShows = 10;
var numTickets = 100;
$(document).ready(function() {
for(i=0; i < numTickets; i++)
{
var numTotal = i + 1;
$('.container').append("<p>There are " + numTotal + " tickets available</p>");
}
});
</script>
<body>
<div class="container">
</div>
</body>
</html>
0 comments:
Post a Comment