PHP lwn. Ajax: Penyelesaian untuk mencipta kandungan yang dimuatkan secara dinamik

Ajax (JavaScript tak segerak dan XML) membenarkan penambahan kandungan dinamik tanpa memuatkan semula halaman. Menggunakan PHP dan Ajax, anda boleh memuatkan senarai produk secara dinamik: HTML mencipta halaman dengan elemen kontena yang mana data ditambahkan selepas permintaan Ajax memuatkannya. JavaScript menggunakan Ajax untuk menghantar permintaan kepada pelayan melalui XMLHttpRequest untuk mendapatkan data produk dalam format JSON daripada pelayan. PHP menggunakan MySQL untuk menanyakan data produk daripada pangkalan data dan mengekodnya ke dalam format JSON. JavaScript menghuraikan data JSON dan memaparkannya dalam bekas halaman. Mengklik butang mencetuskan permintaan Ajax untuk memuatkan senarai produk.

php vs. Ajax: Penyelesaian untuk mewujudkan kandungan yang dimuatkan secara dinamik

Antroduction

ajax (JavaScript Asynchronous dan XML) adalah teknologi yang kuat yang membolehkan memuatkan kandungan tanpa memuatkan keseluruhan halaman kandungan ke laman web. Artikel ini akan membimbing anda membuat tapak web yang memuatkan kandungan secara dinamik menggunakan PHP dan Ajax.

Kes praktikal

Contoh berikut menunjukkan cara menggunakan PHP dan Ajax untuk memuatkan senarai produk secara dinamik pada halaman bernama "products.php":

Kod HTML

<div id="product-container"></div>

<script>
// Ajax 请求函数
function loadProducts() {
    var xhr = new XMLHttpRequest();
    xhr.open("GET", "get_products.php", true);
    xhr.onload = function() {
        if (xhr.readyState === 4 && xhr.status === 200) {
            var products = JSON.parse(xhr.responseText);
            displayProducts(products);
        }
    };
    xhr.send();
}

// 显示产品函数
function displayProducts(products) {
    var productContainer = document.getElementById("product-container");
    for (var i = 0; i < products.length; i++) {
        var productItem = document.createElement("div");
        productItem.innerHTML = products[i].name + " - $" + products[i].price;
        productContainer.appendChild(productItem);
    }
}

// 加载按钮点击事件
document.getElementById("load-button").addEventListener("click", loadProducts);
</script>

kod

PHP

Contoh Jalankan

2. Simpan fail HTML dan PHP pada pelayan anda.
3. Lawati halaman "products.php".
4. Klik butang "Muat".

Penyenaraian produk akan dimuatkan secara dinamik ke dalam halaman tanpa memuatkan semula keseluruhan halaman.

Kesimpulan

🎜Dengan menggabungkan PHP dan Ajax, anda boleh mencipta halaman web interaktif dinamik yang mengemas kini kandungan dengan mudah tanpa memuat semula. Ini penting untuk memaparkan data masa nyata, sembang langsung dan aplikasi lain yang memerlukan data dikemas kini secara berkala. 🎜

Atas ialah kandungan terperinci PHP lwn. Ajax: Penyelesaian untuk mencipta kandungan yang dimuatkan secara dinamik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!