Trình tải nội dung trang với AJAX

[JavaScriptBank]

AJAX - một kĩ thuật phát triển web đang rất được ưa chuộng và thịnh hành. Bạn có thể dùng hiệu ứng AJAX (http://www.javascriptbank.com/javascript/) này để tải các tập tin XML v... chi tiết (http://www.javascriptbank.com/ajax-page-content-loader.html/vi//) tại JavaScriptBank.com - 2.000+ free JavaScript codes (http://www.javascriptbank.com/)


http://www.javascriptbank.com/javascript.images/ajax/ajax-page-content-loader.jpg (http://www.javascriptbank.com/javascript/ajax/ajax-page-content-loader/preview/vi/)
Demo: Trình tải nội dung trang với AJAX (http://www.javascriptbank.com/ajax-page-content-loader.html/vi/)
| AJAX Page Content Loader (http://www.javascriptbank.com/ajax-page-content-loader.html)

Cách cài đặt

Bước 1: Copy mã CSS bên dưới và dán vào khu vực HEAD trên trang web của bạn
CSS

<style type="text/css">
<!--
#contentLYR {
position:relative;/*
width:200px;
height:115px;
left: 200px;
top: 200px;*/
z-index:1;
}
-->
</style>

Bước 2: Đặt mã JavaScript bên dưới vào phần HEAD
JavaScript

<script type="text/javascript">
<!-- Begin
/*
This script downloaded from www.JavaScriptBank.com
Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/

// Created by: Eddie Traversa (2005) :: http://dhtmlnirvana.com/
function ajaxLoader(url,id) {
if (document.getElementById) {
var x = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
}
if (x) {
x.onreadystatechange = function() {
if (x.readyState == 4 && x.status == 200) {
el = document.getElementById(id);
el.innerHTML = '<JavaScriptBank>This is content of demo.xml file</JavaScriptBank>';//x.responseText;
}
}
x.open("GET", url, true);
x.send(null);
}
}
//-->
</script>

Bước 3: Đặt mã HTML bên dưới vào phần BODY
HTML

<div id="contentLYR"></div>
<script>window.onload = function(){ajaxLoader('demo.xml','contentLYR');}</script>

Bước 4: các file cần tải
Files
demo.xml (http://www.javascriptbank.com/javascript/ajax/AJAX_Page_Content_Loader/demo.xml)



Đoạn mã tương tự
- Nội dung di chuyển (http://www.javascriptbank.com/crawling-content.html/vi/)
- Liên kết nội dung liên quan (http://www.javascriptbank.com/semantic-on-page-content-list.html/vi/)
- Tạo nội dung ngẫu nhiên (http://www.javascriptbank.com/random-text-generator.html/vi/)


Một vài nhãn tương tự: tải nội dung (http://www.javascriptbank.com/vi+tag=tải nội dung), nội dung trang (http://www.javascriptbank.com/vi+tag=nội dung trang), AJAX (http://www.javascriptbank.com/vi+tag=AJAX), kĩ thuật (http://www.javascriptbank.com/vi+tag=kĩ thuật), phát triển web (http://www.javascriptbank.com/vi+tag=phát triển web), thịnh hành (http://www.javascriptbank.com/vi+tag=thịnh hành), tập tin (http://www.javascriptbank.com/vi+tag=tập tin), XML (http://www.javascriptbank.com/vi+tag=XML), HTML (http://www.javascriptbank.com/vi+tag=HTML), đường dẫn (http://www.javascriptbank.com/vi+tag=đường dẫn)
Bạn có thể xem thêm nhiều JavaScript khác về Ajax (http://www.javascriptbank.com/javascript/ajax/vi/)





Trình chơi nhạc giao diện WMP và iPhone 3G (http://www.javascriptbank.com/mp3-player-with-wmp-and-iphone-3g-skin.html/vi/) - JavaScript chạy theo thanh cuộn (http://www.javascriptbank.com/vi=chạy theo thanh cuộn) - JavaScript lấy vị trị trỏ chuột (http://www.javascriptbank.com/forum/hoi-ve-javascript-t180.html)