AJAX ਸਰਵਸਾਧਾਰਨ

AJAX ਵਿਕਾਸਕਾਰ ਲਈ ਸੁਪਨਾ ਹੈ ਕਿਉਂਕਿ ਤੁਸੀਂ ਇਹ ਕਰ ਸਕਦੇ ਹੋ:

  • ਪੇਜ ਨੂੰ ਫਿਰ ਚਾਲੂ ਕਰੋ ਬਿਨਾਂ ਵੈੱਬਸਾਈਟ ਅੱਪਡੇਟ ਕਰੋ
  • ਪੇਜ ਲੋਡ ਹੋਣ ਦੇ ਬਾਅਦ ਸਰਵਰ ਤੋਂ ਡਾਟਾ ਕਰਵਾਓ
  • ਪੇਜ ਲੋਡ ਹੋਣ ਦੇ ਬਾਅਦ ਸਰਵਰ ਤੋਂ ਡਾਟਾ ਮਿਲੋ
  • ਪਿੱਛੇ ਰਾਹੀਂ ਸਰਵਰ ਨੂੰ ਡਾਟਾ ਭੇਜੋ

AJAX ਉਦਾਹਰਣ

ਹੇਠ ਦਾ ਬਟਨ ਕਲਿੱਕ ਕਰਕੇ ਇਸ ਟੈਕਸਟ ਨੂੰ Ajax ਬਦਲੋ:

ਸਵੈ ਕੋਸ਼ਿਸ਼ ਕਰੋ

AJAX ਇੰਸਟੈਂਸ ਵਿਸਥਾਰ

HTML ਪੇਜ

<!DOCTYPE html>
<html>
<body>
<div id="demo">
  <h2>ਇਸ ਟੈਕਸਟ ਨੂੰ AJAX ਬਦਲੋ</h2>
  <button type="button" onclick="loadDoc()">ਟੈਕਸਟ ਬਦਲੋ</button>
</div>
</body>
</html>

ਇਹ HTML ਪੇਜ ਇੱਕ <div> ਅਤੇ ਇੱਕ <button> ਸਮੇਤ ਹੈ。

<div> ਸਰਵਰ ਤੋਂ ਮਿਲੀ ਸੂਚਨਾ ਦਿਸਾਉਣ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ。

<button> ਫੰਕਸ਼ਨ ਚਾਲੂ ਕਰੋ (ਜਦੋਂ ਇਹ ਕਲਿੱਕ ਕੀਤਾ ਜਾਵੇ)。

ਇਹ ਫੰਕਸ਼ਨ web ਸਰਵਰ ਤੋਂ ਡਾਟਾ ਕਰਵਾਉਂਦਾ ਹੈ ਅਤੇ ਇਸਨੂੰ ਦਿਸਾਉਂਦਾ ਹੈ:

Function loadDoc()
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
     document.getElementById("demo").innerHTML = this.responseText;
    }
  };
  xhttp.open("GET", "ajax_info.txt", true);
  xhttp.send();
}

ਕੀ AJAX ਹੈ?

AJAX = Asynchronous JavaScript And XML.

AJAX 并非编程语言。

AJAX 仅仅组合了：

  • 浏览器内建的 XMLHttpRequest 对象（从 web 服务器请求数据）
  • JavaScript 和 HTML DOM（显示或使用数据）

Ajax ਇੱਕ ਭ੍ਰਮਿਤ ਨਾਮ ਹੈ।Ajax ਐਪਲੀਕੇਸ਼ਨ ਪ੍ਰਕਿਰਿਆ ਵਿੱਚ XML ਨੂੰ ਟ੍ਰਾਂਸਫਰ ਕਰ ਸਕਦੇ ਹਨ, ਪਰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਪੂਰਨ ਟੈਕਸਟ ਜਾਂ JSON ਟੈਕਸਟ ਨੂੰ ਟ੍ਰਾਂਸਫਰ ਕਰਨਾ ਵੀ ਆਮ ਹੈ

Ajax ਵੈੱਬ ਸਰਵਰ ਦੇ ਪਿੱਛੇ ਦੇਣ ਦੇ ਰੂਪ ਵਿੱਚ ਡਾਟਾ ਨਾਲ ਅਸਿਧਾ ਵੈੱਬ ਪੰਨੇ ਨੂੰ ਅੱਪਡੇਟ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ।ਇਹ ਮਤਲਬ ਹੈ ਕਿ ਵੈੱਬ ਪੰਨੇ ਦਾ ਕੁਝ ਹਿੱਸਾ ਅੱਪਡੇਟ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ ਬਿਨਾ ਕਿ ਪੂਰੇ ਪੰਨੇ ਨੂੰ ਫਿਰ ਲੋਡ ਕੀਤੇ ਜਾਵੇ

AJAX ਕਿਵੇਂ ਕੰਮ ਕਰਦਾ ਹੈ

AJAX
  1. ਵੈੱਬ ਪੰਨੇ ਵਿੱਚ ਇੱਕ ਈਵੈਂਟ ਹੋਇਆ (ਪੰਨਾ ਲੋਡ ਹੋਣਾ, ਬਟਨ ਦਬਾਉਣਾ)
  2. ਜਾਵਾਸਕ੍ਰਿਪਟ ਰਾਹੀਂ XMLHttpRequest ਆਬਜੈਕਟ ਬਣਾਇਆ ਜਾਵੇਗਾ
  3. XMLHttpRequest ਆਬਜੈਕਟ ਵੈੱਬ ਸਰਵਰ ਨੂੰ ਬੇਨਤੀ ਭੇਜੇਗਾ
  4. ਸਰਵਰ ਪ੍ਰਾਰਭ ਨੂੰ ਪ੍ਰਬੰਧਨ ਕਰੇਗਾ
  5. ਸਰਵਰ ਜਵਾਬ ਨੂੰ ਵੈੱਬ ਪੰਨੇ ਵਿੱਚ ਭੇਜੇਗਾ
  6. ਜਾਵਾਸਕ੍ਰਿਪਟ ਰਾਹੀਂ ਜਵਾਬ ਪ੍ਰਾਪਤ ਕਰਨਾ
  7. ਜਾਵਾਸਕ੍ਰਿਪਟ ਰਾਹੀਂ ਸਹੀ ਕਾਰਵਾਈ (ਉਦਾਹਰਣ ਵਜੋਂ ਪੰਨਾ ਅੱਪਡੇਟ ਕਰਨਾ)