Phương thức .get() và .post() trong JQuery Ajax

Một ưu điểm tuyệt vời mà Ajax đó là khi làm việc trang web không phải load lại trang. Điều này giảm thiểu đáng kể thời gian chờ đợi phản hồi cũng như dung lượng tải xuống. Ajax cung cấp hai phương thức Get() và Post() cho phép gửi và truy xuất dữ liệu không đồng bộ từ máy chủ web nhanh chóng.

Hãy cùng với mình đi tìm hiểu rõ hơn về .get() và .post() trong JQuery Ajax qua bài viết dưới đây.

Về cơ bản thì cả .get() và .post() không có sự khác biệt là mấy. Điểm khác nhau đó là .post() dùng để truy xuất thông tin có tính bảo mật cao. Chẳng hạn như thông tin của người dùng như thẻ ngân hàng, mật khẩu…

Phương thức .get()

$.get(URL, data, success);

Giải thích thông số:

  • Tham số URL bắt buộc chỉ định URL mà yêu cầu được gửi đến.
  • Tham số data tùy chọn chỉ định một tập hợp chuỗi truy vấn (tức là các cặp khóa / giá trị) được gửi đến máy chủ web cùng với yêu cầu.
  • Tham số success về cơ bản là một hàm gọi lại được thực thi nếu yêu cầu thành công. Nó thường được sử dụng để lấy dữ liệu trả về.

Bây giờ hãy thực hiện 1 ví dụ sau:

Tạo ra tập tin là getinfo.php

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ví dụ về GET trong Ajax JQuery</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $.get("getdate.php", function(data){
            $("#demo").html(data);
        });
    });
});
</script>
</head>
<body>
    <div id="demo">
        <h3>Kết quả sẽ được thay thế bằng ngày và giờ từ máy chủ</h3>
    </div>
    <button type="button">Xác nhận</button>
</body>
</html>

Và một tập tin nữa là getdate.php với nội dung

<?php
echo "Hôm nay là " . date("Y-m-d") . "<br>";
echo "Hôm nay là " . date("l");
?>

Sau khi ấn nút thông tin từ getdate.php sẽ được đưa vào getinfo.php mà không phải load lại trang này.

Phương thức .post()

$.post( url, [data], [callback], [type] )

Giải thích thông số:

  • url – Một chuỗi chứa URL mà yêu cầu được gửi đến
  • data – Tham số tùy chọn này đại diện cho các cặp khóa / giá trị sẽ được gửi đến máy chủ.
  • callback – Tham số tùy chọn này đại diện cho một hàm được thực thi bất cứ khi nào dữ liệu được tải thành công.
  • type – Tham số tùy chọn này đại diện cho một loại dữ liệu được trả về cho hàm gọi lại: “xml”, “html”, “script”, “json”, “jsonp” hoặc “text”.

Cũng với ví dụ ở trên bạn sẽ thay thế bằng .post(). Sự khác nhau đó là khi sử dụng với .post thường dùng cho các nhiệm vụ có tính bảo mật cao. Còn .get() thì ngược lại.

Với ưu điểm sử dụng ajax để không load lại trang thì dữ liệu sẽ không bị thay đổi khi thêm hay update. Bạn thấy Ajax jQuery có tuyệt vời không nào?

Related Posts

Cấu trúc dữ liệu và giải thuật: Một cái nhìn tổng quan

Giới thiệu Trong lĩnh vực phát triển phần mềm, cấu trúc dữ liệu và giải thuật là hai khái niệm quan trọng không thể thiếu. Cấu trúc…

Next.js – Khám phá Framework JavaScript tuyệt vời cho phát triển ứng dụng web

Giới thiệu về Next.js Next.js là một framework JavaScript mã nguồn mở và phổ biến được sử dụng để xây dựng các ứng dụng web hiệu suất…

Lisp – Cái nhìn tổng quan về ngôn ngữ lập trình đặc biệt

Lisp là gì? Lisp là một ngôn ngữ lập trình đặc biệt mang đến một cách tiếp cận độc đáo trong việc xử lý thông tin và…

Cách sử dụng đường dẫn tương đối trong HTML

Cách sử dụng đường dẫn tương đối trong HTML

Trang web hiện đại thường bao gồm nhiều tài nguyên như hình ảnh, trang HTML khác, tệp tin CSS và JavaScript. Để liên kết và truy cập…

Bài tập về hàm split trong Python

Chuỗi là một loại dữ liệu phổ biến trong lập trình, và việc xử lý chuỗi là một kỹ năng cần thiết cho các lập trình viên….

Xử lý chuỗi trong Python: Các phương thức cơ bản

Python là một trong những ngôn ngữ lập trình phổ biến nhất hiện nay. Nó được sử dụng rộng rãi trong nhiều lĩnh vực, từ phát triển…

Game bài đổi thưởng hữu ích:

Tải Sunwin | Tải Go88 | Hit Club | 789 | Trang Chủ Kubet