Often when we use some type of AJAX component we are often using the html action to replace part of or all of some elements of the DOM with new elements. Now you can code it for each piece of content in your page or you can take advantage of populating your elements with data when you need it. For example lets suppose we have a next week calculator.
<div id="calculator">
<p>Next week will be <span id="numDays">0</span> number of days from beginning of the moth</p>
</div>
now with the following jQuerywe can update the text of these containers:
$(this).find('#numDays').text(getNumberOfDays());
We have made the part of the HTML page that will change updateable via client-side templating. The rest of the div tag wil not change and only the number of days will change based on when and where the page is rendered. This can be done for each element and allows for us to leave all the markup in the HTML where it belongs and allows for us to use datasources that can be pulled using AJAX or injected directly via a scripting language.
No comments:
Post a Comment