ความแตกต่างระหว่าง$.ajax()
และ$.get()
กับ$.load()
คืออะไร?
ข้อไหนดีกว่าที่จะใช้และในเงื่อนไขใด?
ความแตกต่างระหว่าง$.ajax()
และ$.get()
กับ$.load()
คืออะไร?
ข้อไหนดีกว่าที่จะใช้และในเงื่อนไขใด?
คำตอบ:
$.ajax()
เป็นหนึ่งที่กำหนดค่าได้มากที่สุดที่คุณได้รับการควบคุมที่ละเอียดกว่าส่วนหัว HTTP และเช่น คุณยังสามารถเข้าถึง XHR- วัตถุโดยตรงโดยใช้วิธีนี้ นอกจากนี้ยังมีการจัดการข้อผิดพลาดที่ละเอียดยิ่งขึ้นเล็กน้อย อาจซับซ้อนและไม่จำเป็นบ่อยครั้ง แต่บางครั้งก็มีประโยชน์มาก คุณต้องจัดการกับข้อมูลที่ส่งคืนด้วยตัวคุณเองด้วยการติดต่อกลับ
$.get()
เป็นเพียงการจดชวเลข$.ajax()
แต่สรุปการกำหนดค่าบางอย่างออกไปตั้งค่าเริ่มต้นที่เหมาะสมสำหรับสิ่งที่ซ่อนจากคุณ ส่งคืนข้อมูลไปยังการเรียกกลับ อนุญาตเฉพาะการร้องขอ GET ดังนั้นจึงมาพร้อมกับ$.post()
ฟังก์ชั่นสำหรับนามธรรมที่คล้ายกันเฉพาะสำหรับ POST
.load()
คล้ายกับ$.get()
แต่เพิ่มฟังก์ชันการทำงานซึ่งช่วยให้คุณสามารถกำหนดตำแหน่งที่จะแทรกข้อมูลที่ส่งคืนในเอกสาร ดังนั้นใช้งานได้จริงเมื่อการโทรเท่านั้นจะส่งผลให้ HTML มันถูกเรียกแตกต่างจากสายอื่น ๆ ทั่วโลกเล็กน้อยเนื่องจากเป็นวิธีการเชื่อมโยงกับองค์ประกอบ DOM ที่ห่อหุ้ม jQuery โดยเฉพาะ ดังนั้นหนึ่งจะทำ:$('#divWantingContent').load(...)
มันควรจะตั้งข้อสังเกตว่าทั้งหมด$.get()
, $.post()
, .load()
มีทั้งหมดห่อเพียงสำหรับการ$.ajax()
ที่มันเรียกว่าภายใน
รายละเอียดเพิ่มเติมในเอกสาร Ajax ของ jQuery: http://api.jquery.com/category/ajax/
วิธีการให้ชั้นต่าง ๆ ของสิ่งที่เป็นนามธรรม
$.ajax()
ให้คุณควบคุมคำขอ Ajax ได้อย่างสมบูรณ์ คุณควรใช้มันหากวิธีอื่นไม่เต็มความต้องการของคุณ
$.get()
ดำเนินการGET
ร้องขอAjax ข้อมูลที่ส่งคืน (ซึ่งสามารถเป็นข้อมูลใด ๆ ) จะถูกส่งผ่านไปยังตัวจัดการการโทรกลับของคุณ
$(selector).load()
จะดำเนินการGET
คำขอAjax และจะตั้งค่าเนื้อหาของข้อมูลที่ส่งคืนที่เลือก (ซึ่งควรเป็นข้อความหรือ HTML)
ขึ้นอยู่กับสถานการณ์ที่วิธีการที่คุณควรใช้ $.ajax()
หากคุณต้องการที่จะทำสิ่งที่เรียบง่ายไม่มีความจำเป็นที่จะรำคาญกับ
เช่นคุณจะไม่ใช้$.load()
หากข้อมูลที่ส่งคืนจะเป็น JSON ซึ่งจะต้องดำเนินการเพิ่มเติม ที่นี่คุณอาจจะใช้หรือ$.ajax()
$.get()
http://api.jquery.com/jQuery.ajax/
jQuery.ajax()
คำอธิบาย: ดำเนินการตามคำขอ HTTP (Ajax) แบบอะซิงโครนัส
เงินทั้งหมดช่วยให้คุณสามารถร้องขอ Ajax ได้ทุกประเภท
http://api.jquery.com/jQuery.get/
jQuery.get()
คำอธิบาย: โหลดข้อมูลจากเซิร์ฟเวอร์โดยใช้คำขอ HTTP GET
ให้คุณส่งคำขอ HTTP GET เท่านั้นต้องการการกำหนดค่าน้อยกว่าเล็กน้อย
.load()
คำอธิบาย: โหลดข้อมูลจากเซิร์ฟเวอร์และวาง HTML ที่ส่งคืนลงในองค์ประกอบที่ตรงกัน
มีความเชี่ยวชาญในการรับข้อมูลและฉีดเข้าไปในองค์ประกอบ
ธรรมดามาก แต่
$.load()
: โหลดชิ้นส่วน html ลงใน DOM คอนเทนเนอร์$.get()
: ใช้สิ่งนี้หากคุณต้องการโทรออกGETและเล่นอย่างกว้างขวางด้วยการตอบสนอง$.post()
: ใช้สิ่งนี้หากคุณต้องการทำการโทรPOSTและไม่ต้องการโหลดการตอบกลับไปยัง DOM คอนเทนเนอร์บางตัว$.ajax()
: ใช้สิ่งนี้หากคุณต้องการทำอะไรบางอย่างเมื่อ XHR ล้มเหลวหรือคุณต้องระบุตัวเลือก ajax (เช่นแคช: จริง) ได้ทันทีหมายเหตุสำคัญ: jQuery.load () method สามารถไม่เพียง แต่ได้รับแต่ยังPOSTคำขอถ้าข้อมูลพารามิเตอร์จะมา (ดู: http://api.jquery.com/load/ )
ชนิดข้อมูล : PlainObject หรือ String วัตถุหรือสตริงธรรมดาที่ส่งไปยังเซิร์ฟเวอร์พร้อมคำขอ
วิธีการร้องขอวิธีการPOSTจะใช้หากมีการให้ข้อมูลเป็นวัตถุ มิฉะนั้นGETจะถือว่า
Example: pass arrays of data to the server (POST request)
$( "#objectID" ).load( "test.php", { "choices[]": [ "Jon", "Susan" ] } );
ทุกคนมีสิทธิ ฟังก์ชั่น.load
, .get
และมีวิธีการที่แตกต่างกันของการใช้ฟังก์ชั่น.post
.ajax
โดยส่วนตัวแล้วฉันพบว่าฟังก์ชั่น raw. jax ทำให้เกิดความสับสนและต้องการใช้โหลดรับหรือโพสต์ตามที่ฉันต้องการ
POST มีโครงสร้างดังต่อไปนี้:
$.post(target, post_data, function(response) { });
GET มีดังต่อไปนี้:
$.get(target, post_data, function(response) { });
โหลดมีดังต่อไปนี้:
$(*selector*).load(target, post_data, function(response) { });
อย่างที่คุณเห็นมีความแตกต่างกันเล็กน้อยระหว่างพวกเขาเนื่องจากสถานการณ์ที่เป็นตัวกำหนดว่าจะใช้อะไร ต้องการส่งข้อมูลไปยังไฟล์ภายในหรือไม่ ใช้. post (นี่จะเป็นกรณีส่วนใหญ่) ต้องการส่งข้อมูลในลักษณะที่คุณสามารถให้ลิงก์ไปยังช่วงเวลาที่เฉพาะเจาะจงหรือไม่ ใช้. รับ ทั้งคู่อนุญาตการโทรกลับซึ่งคุณสามารถจัดการการตอบกลับของไฟล์ได้
สิ่งสำคัญคือ. load ทำหน้าที่ในมารยาทที่แตกต่างกันสองแบบ หากคุณให้เฉพาะ url ของเอกสารเป้าหมายมันจะทำหน้าที่เป็นตัวรับ (และฉันบอกว่าทำเพราะฉันทดสอบการตรวจสอบ$_POST
ใน PHP ที่เรียกว่าในขณะที่ใช้พฤติกรรมการโหลดเริ่มต้นและตรวจพบ$_POST
ไม่ใช่$_GET
อาจจะแม่นยำกว่า บอกว่ามันทำหน้าที่เป็น. post โดยไม่มีข้อโต้แย้งใด ๆ ); อย่างไรก็ตามในฐานะhttp://api.jquery.com/load/กล่าวว่าเมื่อคุณให้อาเรย์ของอาร์กิวเมนต์แก่ฟังก์ชันแล้วจะโพสต์ข้อมูลไปยังไฟล์ ฟังก์ชั่น. load จะแทรกข้อมูลลงในองค์ประกอบ DOM โดยตรงซึ่งในกรณี MANY นั้นอ่านง่ายและตรงไปตรงมามาก แต่ก็ยังมีการติดต่อกลับหากคุณต้องการทำอะไรมากกว่านี้กับการตอบกลับ นอกจากนี้. load ช่วยให้คุณสามารถสกัดบล็อกโค้ดบางไฟล์จากไฟล์ทำให้คุณมีความเป็นไปได้ที่จะบันทึกแคตตาล็อกเช่นในไฟล์ html และดึงชิ้นส่วน (รายการ) ลงในองค์ประกอบ DOM โดยตรง
$.get = $.ajax({type: 'GET'});
$.load()
เป็นฟังก์ชั่นตัวช่วยซึ่งสามารถเรียกใช้ได้เฉพาะกับองค์ประกอบเท่านั้น
$.ajax()
ช่วยให้คุณควบคุมได้มากที่สุด คุณสามารถระบุว่าคุณต้องการที่จะโพสต์ข้อมูลรับโทรกลับมากขึ้น ฯลฯ
ทั้งสองใช้เพื่อส่งข้อมูลและรับการตอบกลับโดยใช้ข้อมูลนั้น
GET : รับข้อมูลที่เก็บไว้ในเซิร์ฟเวอร์ (เช่นการค้นหาทวีตข้อมูลบุคคล) หากคุณต้องการที่จะส่งข้อมูลจากนั้นรับคำขอส่งคำขอโดยใช้process.php?name=subroto
ดังนั้นโดยทั่วไปจะส่งข้อมูลผ่าน URL URL ไม่สามารถจัดการได้มากกว่า 2036 ถ่าน ดังนั้นสำหรับการโพสต์บล็อกคุณสามารถจำได้หรือไม่?
โพสต์: โพสต์ทำสิ่งเดียวกันกับรับ การลงทะเบียนผู้ใช้, การเข้าสู่ระบบของผู้ใช้, การส่งข้อมูลขนาดใหญ่, โพสต์บล็อก หากคุณต้องการส่งข้อมูลที่ปลอดภัยให้ใช้การโพสต์หรือข้อมูลขนาดใหญ่เนื่องจากไม่ผ่าน url
AJAX : $.get()
และมีคุณลักษณะที่มีส่วนย่อยของ$.post()
$.ajax()
มันมีการกำหนดค่าเพิ่มเติม
$.get ()
$.ajax()
วิธีการซึ่งเป็นชนิดของชวเลขเป็น เมื่อใช้$.get ()
แทนที่จะส่งผ่านวัตถุคุณจะผ่านการขัดแย้ง อย่างน้อยที่สุดคุณจะต้องมีอาร์กิวเมนต์สองข้อแรกซึ่งก็คือ URL ของไฟล์ที่คุณต้องการดึงข้อมูล (เช่นtest.txt)และการเรียกกลับสำเร็จ
ทุกคนอธิบายหัวข้อได้ดีมาก มีอีกหนึ่งจุดที่ฉันต้องการเพิ่มเกี่ยวกับ. load () วิธี
ตามโหลดเอกสาร หากคุณเพิ่มตัวเลือกคำต่อท้ายใน URL ข้อมูลจากนั้นจะไม่เรียกใช้งานสคริปต์ในการโหลดเนื้อหา
$(document).ready(function(){
$("#secondPage").load("mySecondHtmlPage.html #content");
})
ในทางกลับกันหลังจากลบตัวเลือกใน url สคริปต์ในเนื้อหาใหม่จะทำงาน ลองตัวอย่างนี้
หลังจากลบ #content ใน url ในไฟล์ index.html
$(document).ready(function(){
$("#secondPage").load("mySecondHtmlPage.html");
})
ไม่มีคุณสมบัติที่สร้างขึ้นโดยวิธีอื่นในการอภิปราย