ホームページ  >  記事  >  ウェブフロントエンド  >  ajaxを使用するにはjqueryを導入する必要がありますか?

ajaxを使用するにはjqueryを導入する必要がありますか?

WBOY
WBOYオリジナル
2022-08-31 16:20:163368ブラウズ

ajax を使用する場合、jquery を導入する必要はありません。ajax の正式名称は「Asynchronous javascript and XML」、つまり非同期の JavaScript と XML で、インタラクティブな Web アプリケーションを作成するための Web 開発技術を指します。 JavaScriptはもともとajaxをサポートしており、ネイティブのajaxリクエストを利用する場合には、当然jqueryを導入する必要はありません。

ajaxを使用するにはjqueryを導入する必要がありますか?

#この記事の動作環境: Windows10 システム、javascript1.8.5&&html5 バージョン、DELL G3 コンピューター。

ajax を使用するには jquery を導入する必要がありますか?

js は元々 ajax をサポートしていますが、ネイティブの ajax リクエストを使用している場合は、もちろん jquery ライブラリを呼び出す必要はありません。

AJAX は「Asynchronous javascript and XML」(非同期 JavaScript と XML) の略で、インタラクティブな Web アプリケーションを作成するための Web 開発テクノロジを指します。 AJAX を使用すると、バックグラウンドでサーバーと少量のデータを交換することで、Web ページを非同期に更新できます。これは、ページ全体を再読み込みしなくても、Web ページの一部を更新できることを意味します。

AJAX を使用する理由AJAXの利点?

AJAX は新しいプログラミング言語ではなく、より優れた、より高速で、よりインタラクティブな Web アプリケーションを作成するためのテクノロジです。

JavaScript を使用してサーバーにリクエストを送信し、ユーザーをブロックせずに応答を処理します。コアオブジェクト XMLHTTPRequest。このオブジェクトを通じて、JavaScript はページをリロードせずに Web サーバーとデータを交換できます。

AJAX はブラウザと Web サーバーの間で非同期データ転送 (HTTP リクエスト) を使用します。これにより、Web ページはページ全体ではなく少量の情報をサーバーに要求できます。

AJAX は、インターネット アプリケーションをより小さく、より高速に、そしてよりユーザーフレンドリーにします。

AJAX は、Web サーバー ソフトウェアから独立したブラウザ テクノロジです。 AJAX は、JavaScript、XML、HTML、CSS の Web 標準に基づいています。AJAX で使用される Web 標準は明確に定義されており、すべての主要なブラウザでサポートされています。 AJAX アプリケーションはブラウザーやプラットフォームに依存しません。

Web アプリケーションには、デスクトップ アプリケーションに比べて多くの利点があります。Web アプリケーションは、より広範囲のユーザーに利用できること、インストールと保守が容易であること、開発が容易であることなどです。

ただし、インターネット アプリケーションは、従来のデスクトップ アプリケーションほど完全ではなく、使いやすいものでもありません。 AJAX を通じて、インターネット アプリケーションはより完成度が高く、より使いやすくなります。

JavaScript での Ajax の使用。

Get メソッドの実装:

<script type="text/javascript">
     var xmlHttpRequest;
     //创建XHR对象
     function createXmlHttpRequest() {
         // if(typefo(XMLHttpRequest)!=&#39;undifine&#39;)
         if (window.ActiveXObject) { //如果是IE浏览器    
             return new ActiveXObject("Microsoft.XMLHTTP");
         } else if (window.XMLHttpRequest) { //非IE浏览器    
             return new XMLHttpRequest();
         }
     }
 
     //Ajax调用的方法
     function AjaxClick() {
         var url = "这里是你想要请求的URL,其中包括你的参数(?key1=value1&key2=value2)";
         //1.创建XMLHttpRequest组建    
         xmlHttpRequest = createXmlHttpRequest();
         //2.设置回调函数
         xmlHttpRequest.onreadystatechange = ajaxCallBack;
         //onreadystatechange。存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。
         //3.初始化XMLHttpRequest组建    
         xmlHttpRequest.open("GET", url, true);
 
         //open(method,url,async),规定请求的类型、URL 以及是否异步处理请求。
         //method:请求的类型;GET 或 POST
         //url:文件在服务器上的位置
         //async:true(异步)或 false(同步)
 
         //GET方式请求可以设置浏览器不使用缓存,需加上下面这段
         //xhr.setRequestHeader("If-Modified-Since", "0");
 
         //4.发送请求    
         xmlHttpRequest.send(null);
     }
 
     //回调函数    
     function ajaxCallBack() {
         //readyState 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
         //0: 请求未初始化
         //1: 服务器连接已建立
         //2: 请求已接收
         //3: 请求处理中
         //4: 请求已完成,且响应已就绪
 
         //status    请求响应状态码
         //200: "OK"
         //404: 未找到页面
         if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200) {
             //表示请求成功,且正常响应
 
             //responseText    获得字符串形式的响应数据。
             //responseXML    获得 XML 形式的响应数据。
             var data = xmlHttpRequest.responseText;
 
             //你具体的代码操作写在这里,如对请求响应的数据如何处理
         }
     }
 </script>

Post メソッドの実装:

<script type="text/javascript">
     var xmlHttpRequest;
     //创建XHR对象
     function createXmlHttpRequest() {
         if (window.ActiveXObject) { //如果是IE浏览器    
             return new ActiveXObject("Microsoft.XMLHTTP");
         } else if (window.XMLHttpRequest) { //非IE浏览器    
             return new XMLHttpRequest();
         }
     }
 
     //Ajax调用的方法
     function AjaxClick() {
         var url = "这里是你想要请求的URL,不包括参数";
         //1.创建XMLHttpRequest组建    
         xmlHttpRequest = createXmlHttpRequest();
         //2.设置回调函数
         xmlHttpRequest.onreadystatechange = ajaxCallBack;
         //3.初始化XMLHttpRequest组建    
         xmlHttpRequest.open("POST", url, true);
         //4.添加请求头:
         xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
         //5.发送请求,send("这里是你的请求参数")
         xmlHttpRequest.send("key1=value1&key2=value2");
     }
 
     //回调函数    
     function ajaxCallBack() {
         if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200) {
             var data = xmlHttpRequest.responseText;
 
             //你具体的代码操作写在这里,如对请求响应的数据如何处理
         }
     }
 </script>

[関連チュートリアルの推奨事項:

AJAX ビデオチュートリアル###】###

以上がajaxを使用するにはjqueryを導入する必要がありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。