AJAX is a powerful technology that can be used to improve the user experience of web pages.By using AJAX, you can make your pages more responsive and efficient.
Asynchronous JavaScript and XML (AJAX) Definition - Zubi Tech Hub |
Asynchronous JavaScript and XML (AJAX)
AJAX เป็นเทคโนโลยีที่ช่วยให้หน้าเว็บสามารถอัปเดตข้อมูลโดยไม่จำเป็นต้องโหลดหน้าเว็บใหม่ทั้งหมด นี้ช่วยให้หน้าเว็บตอบสนองได้มากขึ้นและมีประสิทธิภาพมากขึ้น
AJAX มีสามส่วนหลัก:
JavaScript: JavaScript เป็นภาษาโปรแกรมที่ทำงานบนเบราว์เซอร์ของผู้ใช้
XML: XML เป็นภาษามาร์กอัปที่ใช้เพื่อแลกเปลี่ยนข้อมูลระหว่างโปรแกรม
XMLHttpRequest: XMLHttpRequest เป็น API JavaScript ที่อนุญาตให้หน้าเว็บส่งและรับข้อมูลจากเซิร์ฟเวอร์โดยไม่จำเป็นต้องโหลดหน้าเว็บใหม่ทั้งหมด
AJAX สามารถใช้เพื่อ:
อัปเดตข้อมูลในหน้าเว็บโดยไม่จำเป็นต้องโหลดหน้าเว็บใหม่ทั้งหมด
เรียกใช้ฟังก์ชันบนเซิร์ฟเวอร์โดยไม่ต้องโหลดหน้าเว็บใหม่ทั้งหมด
โต้ตอบกับผู้ใช้ในขณะที่หน้าเว็บกำลังโหลด
AJAX เป็นเทคโนโลยีที่มีประสิทธิภาพมากและสามารถปรับปรุงประสบการณ์ผู้ใช้ของหน้าเว็บได้อย่างมาก
Here is an example of how AJAX can be used to update data on a web page:
function updateData() {
var xhr = new XMLHttpRequest();
xhr.open('GET', '/api/data.json');
xhr.onload = function() {
if (xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
document.getElementById('data').innerHTML = data.message;
} else {
console.log('Error fetching data');
}
};
xhr.send();
}
This function first creates an XMLHttpRequest object.
The open() method of this object is used to open a connection to the /api/data.json endpoint. The onload event handler of this object is used to handle the response from the server. If the response is successful (status code 200), the data is parsed and displayed on the page. Otherwise, an error message is logged.
To use this function, you would call it from the DOM:
<button onclick="updateData()">Update Data</button>
When the button is clicked, the updateData() function is called and the data on the page is updated.
AJAX is a powerful technology that can be used to improve the user experience of web pages. By using AJAX, you can make your pages more responsive and efficient.
Art Credits : boodnia
If you want me to make a post on any topic feel free to DM or comment below
My YouTube Channel is for edutainment Coding Videos like Devlogs , Fun Coding Stuff , Coding Challenges , Tutorials , and much more , if you like these stuff check out my channel link in Bio - Cody
0 Comments