Maison interface Web js tutoriel js implémentation de l'exemple de code Ajax

js implémentation de l'exemple de code Ajax

Mar 02, 2018 pm 01:24 PM
ajax javascript 代码

Cet article partage principalement avec vous l'exemple de code d'implémentation d'Ajax en js, dans l'espoir d'aider tout le monde.

Les étapes principales pour implémenter Ajax :
1. Définir l'objet ;
Ouvrir le lien ;
4. 🎜>

5. Effectuer le rendu DOM

1. Pourquoi devons-nous définir des objets ?

L'objet XMLHttpRequest est la base d'Ajax. Sa fonction est à utiliser en arrière-plan pour réaliser l'échange de données entre le client et le serveur.

Donc :


Recommandations associées :
"
var xhr;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();
}else{
xhr = new ActiveXObject('Micorsoft.XMLHTTP');
                //在IE5和IE6中只有 ActiveXObject('Micorsoft.XMLHTTP') 能够实现数据交互
}
"
"
<body>
<ul id="showCon">
</ul>
<script type="text/javascript">
var oU = document.getElementById("showCon");
//1.创建对象
var xhr;
//做兼容
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();
}else{  //IE5 IE6
xhr = new ActiveXObject(&#39;Microsoft.XMLHTTP&#39;);
}
//
console.log(xhr.readyState);//0
//2.打开连接
xhr.open("GET","http://datainfo.duapp.com/shopdata/getclass.php");
//
console.log(xhr.readyState);//1
//3.发送请求(数据)
xhr.send();
//4.获取到数据,渲染页面
xhr.onreadystatechange = function(){
//
console.log(xhr.readyState);
if(xhr.readyState == 4 && xhr.status == 200){
//
console.log(xhr.responseText);
var t = xhr.responseText;
//get方法获取的是:字符串.我们需要将其转换成JSON数据进行操作
var data1 = JSON.parse(t); 
//字符串====>json数据!!!!!!!!!!
                                        //json====>字符串
JSON.stringify(data1)
for(var i = 0;i < data1.length;i++){  //因为这里获得的是一个数组,所以首选的是for循环
var oLi = document.createElement("li"); 
oLi.textContent = data1[i].className; 
//每一个对象下面的className值====>创建的每一个li元素
oU.appendChild(oLi);
}
//
注意点:
//
1.字符串===>json
//
2.获取每一个对象里的className的值
//
|--第一步:想到利用for循环得到data1中的每一个元素
//
|--第二步:因为ul中,没有li元素,所以需要进行DOM元素创建;(其实这里可以直接想到:既然创建,必定要进行"添加")
//
|--第三步:把转换之后的   对象[i].className ====> 对应创建的li
//
|--第四步:把赋过值得li追加到ul中
}
}
</script>
</body>
"
Copier après la connexion

Implémentation JavaScript d'exemples de requêtes asynchrones Ajax

JavaScript natif implémente la requête asynchrone Ajax

jQuery implémente Ajax pour vérifier l'unicité du nom d'utilisateur

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Où trouver la courte de la grue à atomide atomique
1 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Que faire si le code d'écran bleu 0x0000001 apparaît Que faire si le code d'écran bleu 0x0000001 apparaît Feb 23, 2024 am 08:09 AM

Que faire avec le code d'écran bleu 0x0000001. L'erreur d'écran bleu est un mécanisme d'avertissement en cas de problème avec le système informatique ou le matériel. Le code 0x0000001 indique généralement une panne de matériel ou de pilote. Lorsque les utilisateurs rencontrent soudainement une erreur d’écran bleu lors de l’utilisation de leur ordinateur, ils peuvent se sentir paniqués et perdus. Heureusement, la plupart des erreurs d’écran bleu peuvent être dépannées et traitées en quelques étapes simples. Cet article présentera aux lecteurs certaines méthodes pour résoudre le code d'erreur d'écran bleu 0x0000001. Tout d'abord, lorsque nous rencontrons une erreur d'écran bleu, nous pouvons essayer de redémarrer

Programme de codes à distance universels GE sur n'importe quel appareil Programme de codes à distance universels GE sur n'importe quel appareil Mar 02, 2024 pm 01:58 PM

Si vous devez programmer un appareil à distance, cet article vous aidera. Nous partagerons les meilleurs codes de télécommande universelle GE pour programmer n’importe quel appareil. Qu'est-ce qu'une télécommande GE ? GEUniversalRemote est une télécommande qui peut être utilisée pour contrôler plusieurs appareils tels que les téléviseurs intelligents, LG, Vizio, Sony, Blu-ray, DVD, DVR, Roku, AppleTV, lecteurs multimédias en streaming et plus encore. Les télécommandes GEUniversal sont disponibles en différents modèles avec différentes caractéristiques et fonctions. GEUniversalRemote peut contrôler jusqu'à quatre appareils. Les meilleurs codes de télécommande universels à programmer sur n'importe quel appareil. Les télécommandes GE sont livrées avec un ensemble de codes qui leur permettent de fonctionner avec différents appareils. vous pouvez

Résoudre l'erreur du code 0xc000007b Résoudre l'erreur du code 0xc000007b Feb 18, 2024 pm 07:34 PM

Code de terminaison 0xc000007b Lors de l'utilisation de votre ordinateur, vous rencontrez parfois divers problèmes et codes d'erreur. Parmi eux, le code de terminaison est le plus inquiétant, notamment le code de terminaison 0xc000007b. Ce code indique qu'une application ne peut pas démarrer correctement, provoquant des désagréments pour l'utilisateur. Tout d’abord, comprenons la signification du code de terminaison 0xc000007b. Ce code est un code d'erreur du système d'exploitation Windows qui se produit généralement lorsqu'une application 32 bits tente de s'exécuter sur un système d'exploitation 64 bits. Cela signifie que ça devrait

Que représente le code écran bleu 0x000000d1 ? Que représente le code écran bleu 0x000000d1 ? Feb 18, 2024 pm 01:35 PM

Que signifie le code d'écran bleu 0x000000d1 ? Ces dernières années, avec la popularisation des ordinateurs et le développement rapide d'Internet, les problèmes de stabilité et de sécurité du système d'exploitation sont devenus de plus en plus importants. Les erreurs d’écran bleu sont un problème courant, le code 0x000000d1 en fait partie. Une erreur d'écran bleu, ou « Écran bleu de la mort », est une condition qui se produit lorsqu'un ordinateur subit une panne système grave. Lorsque le système ne parvient pas à récupérer de l'erreur, le système d'exploitation Windows affiche un écran bleu avec le code d'erreur à l'écran. Ces codes d'erreur

Comment résoudre l'erreur 403 rencontrée par la requête jQuery AJAX Comment résoudre l'erreur 403 rencontrée par la requête jQuery AJAX Feb 20, 2024 am 10:07 AM

Titre : Méthodes et exemples de code pour résoudre les erreurs 403 dans les requêtes jQuery AJAX L'erreur 403 fait référence à une demande selon laquelle le serveur interdit l'accès à une ressource. Cette erreur se produit généralement parce que la demande manque d'autorisations ou est rejetée par le serveur. Lorsque vous effectuez des requêtes jQueryAJAX, vous rencontrez parfois cette situation. Cet article explique comment résoudre ce problème et fournit des exemples de code. Solution : Vérifiez les autorisations : assurez-vous d'abord que l'adresse URL demandée est correcte et vérifiez que vous disposez des autorisations suffisantes pour accéder à la ressource.

Comment résoudre l'erreur 403 de la requête jQuery AJAX Comment résoudre l'erreur 403 de la requête jQuery AJAX Feb 19, 2024 pm 05:55 PM

jQuery est une bibliothèque JavaScript populaire utilisée pour simplifier le développement côté client. AJAX est une technologie qui envoie des requêtes asynchrones et interagit avec le serveur sans recharger la page Web entière. Cependant, lorsque vous utilisez jQuery pour effectuer des requêtes AJAX, vous rencontrez parfois des erreurs 403. Les erreurs 403 sont généralement des erreurs d'accès refusé par le serveur, probablement en raison de problèmes de politique de sécurité ou d'autorisation. Dans cet article, nous verrons comment résoudre la requête jQueryAJAX rencontrant une erreur 403.

Comment obtenir des variables de la méthode PHP en utilisant Ajax ? Comment obtenir des variables de la méthode PHP en utilisant Ajax ? Mar 09, 2024 pm 05:36 PM

L'utilisation d'Ajax pour obtenir des variables à partir de méthodes PHP est un scénario courant dans le développement Web. Grâce à Ajax, la page peut être obtenue dynamiquement sans actualiser les données. Dans cet article, nous présenterons comment utiliser Ajax pour obtenir des variables à partir de méthodes PHP et fournirons des exemples de code spécifiques. Tout d’abord, nous devons écrire un fichier PHP pour gérer la requête Ajax et renvoyer les variables requises. Voici un exemple de code pour un simple fichier PHP getData.php :

Créer et exécuter des fichiers Linux '.a' Créer et exécuter des fichiers Linux '.a' Mar 20, 2024 pm 04:46 PM

Travailler avec des fichiers dans le système d'exploitation Linux nécessite l'utilisation de diverses commandes et techniques qui permettent aux développeurs de créer et d'exécuter efficacement des fichiers, du code, des programmes, des scripts et d'autres éléments. Dans l'environnement Linux, les fichiers portant l'extension « .a » sont d'une grande importance en tant que bibliothèques statiques. Ces bibliothèques jouent un rôle important dans le développement de logiciels, permettant aux développeurs de gérer et de partager efficacement des fonctionnalités communes sur plusieurs programmes. Pour un développement logiciel efficace dans un environnement Linux, il est crucial de comprendre comment créer et exécuter des fichiers « .a ». Cet article explique comment installer et configurer de manière complète le fichier Linux « .a ». Explorons la définition, l'objectif, la structure et les méthodes de création et d'exécution du fichier Linux « .a ». Qu'est-ce que L

See all articles