AJAX ﯽﻓﺮﻌﻣ


فهرست مطالب

    نمایش فهرست مطالب

AJAX ﺪﯿﻧﺍﻮﺗ ﯽﻣ ﺎﻤﺷ ﺍﺮﯾﺯ ،ﺖﺳﺍ ﻩﺪﻨﻫﺩ ﻪﻌﺳﻮﺗ ﮏﯾ ﯼﺎﯾﻭﺭ:

  • ﻪﺤﻔﺻ ﯼﺮﯿﮔﺭﺎﺑ ﺯﺍ ﺲﭘ - ﺭﻭﺮﺳ ﺏﻭ ﮏﯾ ﺯﺍ ﺎﻫ ﻩﺩﺍﺩ ﻥﺪﻧﺍﻮﺧ

  • ﺪﯿﻨﮐ ﺯﻭﺭ ﻪﺑ ﻪﺤﻔﺻ ﺩﺪﺠﻣ ﯼﺮﯿﮔﺭﺎﺑ ﻥﻭﺪﺑ ﺍﺭ ﺏﻭ ﻪﺤﻔﺻ ﮏﯾ

  • ﻪﻨﯿﻣﺯ ﺲﭘ ﺭﺩ - ﺭﻭﺮﺳ ﺏﻭ ﻪﺑ ﺎﻫ ﻩﺩﺍﺩ ﻝﺎﺳﺭﺍ

AJAX ﻝﺎﺜﻣ

ﺪﻫﺩ ﺮﯿﯿﻐﺗ ﺍﺭ ﻦﺘﻣ ﻦﯾﺍ AJAX ﺪﯿﻫﺩ ﻩﺯﺎﺟﺍ



→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>

<div id="demo">
<h2>The XMLHttpRequest Object</h2>
<button type="button" onclick="loadDoc()">Change Content</button>
</div>

<script>
function loadDoc() {
  const xhttp = new XMLHttpRequest();
  xhttp.onload = function() {
    document.getElementById("demo").innerHTML =
    this.responseText;
  }
  xhttp.open("GET", "ajax_info.txt");
  xhttp.send();
}
</script>

</body>
</html>

AJAX ﺖﺳﺍ ﻩﺪﺷ ﻩﺩﺍﺩ ﺢﯿﺿﻮﺗ ﻝﺎﺜﻣ

HTML ﻪﺤﻔﺻ

<!DOCTYPE html>
<html>
<body>

<div id="demo">
  <h2>Let AJAX change this text</h2>	<button type="button" onclick="loadDoc()">Change Content</button>
 </div>

</body>
</html>

.ﺖﺳﺍ <button> ﮏﯾ ﻭ <div> ﺶﺨﺑ ﮏﯾ ﻞﻣﺎﺷ HTML ﻪﺤﻔﺻ

<div>

.(ﺩﻮﺷ ﮏﯿﻠﮐ ﻥﺁ ﯼﻭﺭ ﺮﮔﺍ) ﺪﻨﮐ ﯽﻣ ﯽﻧﺍﻮﺧﺍﺮﻓ ﺍﺭ ﻊﺑﺎﺗ ﮏﯾ <ﻪﻤﮐﺩ>

ﺪﻨﮐ ﯽﻣ ﺖﺳﺍﻮﺧﺭﺩ ﺏﻭ ﮏﯾ ﺯﺍ ﺍﺭ ﺎﻫ ﻩﺩﺍﺩ ﻊﺑﺎﺗ

()loadDoc ﻊﺑﺎﺗ

function loadDoc() {
  const xhttp = new XMLHttpRequest();
  xhttp.onload = function() {
    
document.getElementById("demo").innerHTML = this.responseText;
    }
  xhttp.open("GET", "ajax_info.txt", true);
  
xhttp.send();
}


AJAX ؟ﺖﺴﯿﭼ

AJAX=Aﻡﺎﮕﻤﻫ JavaScript And

AJAX ﺖﺴﯿﻧ ﯽﺴﯾﻮﻧ ﻪﻣﺎﻧﺮﺑ ﻥﺎﺑﺯ ﮏﯾ.

AJAX ﺪﻨﮐ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ ﺮﯾﺯ ﺩﺭﺍﻮﻣ ﺯﺍ ﯽﺒﯿﮐﺮﺗ ﺯﺍ ﻂﻘﻓ:

  • (ﺏﻭ ﺭﻭﺮﺳ ﺯﺍ ﻩﺩﺍﺩ ﺖﺳﺍﻮﺧﺭﺩ ﯼﺍﺮﺑ) ﺮﮔﺭﻭﺮﻣ ﺭﺩ XMLHttpRequest

  • (ﺎﻫ ﻩﺩﺍﺩ ﺯﺍ ﻩﺩﺎﻔﺘﺳﺍ ﺎﯾ ﺶﯾﺎﻤﻧ ﯼﺍﺮﺑ) HTML DOM ﻭ ﺖﭙﯾﺮﮑﺳﺍ ﺍﻭﺎﺟ

AJAX ﯼﺎﻫ ﻪﻣﺎﻧﺮﺑ .ﺖﺳﺍ ﻩﺪﻨﻨﮐ ﻩﺍﺮﻤﮔ ﻡﺎﻧ ﮏﯾ AJAX ﺯﺍ ﺖﺳﺍ ﻦﮑﻤﻣ XML ﺪﻨﻨﮐ ﻩﺩﺎﻔﺘﺳﺍ ﺎﻫ ﻩﺩﺍﺩ ﻝﺎﻘ

AJAX ﺪﻧﻮﺷ ﺯﻭﺭ ﻪﺑ ﻥﺎﻣﺰﻤﻫﺎﻧ ﺕﺭﻮﺻ ﻪﺑ ،ﻪﻨﺤﺻ ﺖﺸﭘ ﺭﺩ ﺭﻭﺮﺳ ﺏﻭ ﮏﯾ ﺎﺑ ﺎﻫ ﻩﺩﺍﺩ ﻝﺩﺎﺒﺗ ﺎﺑ ﺎﺗ ﺪﻫﺩ


AJAX ﺪﻨﮐ ﯽﻣ ﺭﺎﮐ ﻪﻧﻮﮕﭼ

  • (ﺩﻮﺷ ﯽﻣ ﮏﯿﻠﮐ ﻪﻤﮐﺩ ﮏﯾ ،ﺩﻮﺷ ﯽﻣ ﯼﺮﯿﮔﺭﺎﺑ ﻪﺤﻔﺻ) ﺪﻫﺩ ﯽﻣ ﺥﺭ ﺏﻭ ﻪﺤﻔﺻ ﮏﯾ ﺭﺩ ﺩﺍﺪﯾﻭﺭ ﮏﯾ .1

  • ﺩﻮﺷ ﯽﻣ ﺩﺎﺠﯾﺍ ﺖﭙﯾﺮﮑﺳﺍ ﺍﻭﺎﺟ ﻂﺳﻮﺗ XMLHttpRequest ﯽﺷ ﮏﯾ .2

  • ﺪﻨﮐ ﯽﻣ ﻝﺎﺳﺭﺍ ﺏﻭ ﺭﻭﺮﺳ ﻪﺑ ﺍﺭ ﯽﺘﺳﺍﻮﺧﺭﺩ XMLHttpRequest ﯽﺷ .3

  • ﺪﻨﮐ ﯽﻣ ﺵﺯﺍﺩﺮﭘ ﺍﺭ ﺖﺳﺍﻮﺧﺭﺩ ﺭﻭﺮﺳ .4

  • ﺪﻨﮐ ﯽﻣ ﻝﺎﺳﺭﺍ ﺏﻭ ﻪﺤﻔﺻ ﻪﺑ ﺍﺭ ﯽﺨﺳﺎﭘ ﺭﻭﺮﺳ .5

  • ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﻮﺧ ﺖﭙﯾﺮﮑﺳﺍ ﺍﻭﺎﺟ ﻂﺳﻮﺗ ﺦﺳﺎﭘ .6

  • ﺩﻮﺷ ﯽﻣ ﻡﺎﺠﻧﺍ ﺖﭙﯾﺮﮑﺳﺍ ﺍﻭﺎﺟ ﻂﺳﻮﺗ (ﻪﺤﻔﺻ ﯽﻧﺎﺳﺭ ﺯﻭﺭ ﻪﺑ ﺪﻨﻧﺎﻣ) ﺐﺳﺎﻨﻣ ﻞﻤﻋ .7


(API ﯽﺸﮐﺍﻭ) ﻥﺭﺪﻣ ﯼﺎﻫﺮﮔﺭﻭﺮﻣ

.ﺪﻨﻨﮐ ﻩﺩﺎﻔﺘﺳﺍ XMLHttpRequest ﯽﺷ ﯼﺎﺟ ﻪﺑ Fetch API ﺯﺍ ﺪﻨﻧﺍﻮﺗ ﯽﻣ ﻥﺭﺪﻣ ﯼﺎﻫﺮﮔﺭﻭﺮﻣ

.ﺪﻨﮐ ﻝﺎﺳﺭﺍ ﺏﻭ ﯼﺎﻫﺭﻭﺮﺳ ﻪﺑ ﺍﺭ HTTP ﯼﺎﻫ ﺖﺳﺍﻮﺧﺭﺩ ﺎﺗ ﺪﻫﺩ ﯽﻣ ﻩﺯﺎﺟﺍ ﺏﻭ ﺮﮔﺭﻭﺮﻣ ﻪﺑ Fetch API ﻂ

.ﺪﻫﺩ ﻡﺎﺠﻧﺍ ﺮﺗ ﻩﺩﺎﺳ ﯽﺷﻭﺭ ﻪﺑ ﺍﺭ ﺭﺎﮐ ﻦﯿﻤﻫ ﺪﻧﺍﻮﺗ ﯽﻣ Fetch ،ﺪﯿﻨﮐ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ XMLHttpRequest