Maison >interface Web >js tutoriel >Lire et afficher XML côté serveur avec l'article JavaScript - Partie 1

Lire et afficher XML côté serveur avec l'article JavaScript - Partie 1

Christopher Nolan
Christopher Nolanoriginal
2025-03-10 00:53:09746parcourir

XML joue un rôle vital dans les services Web et peut jouer un rôle puissant en combinaison avec plusieurs langages clients et serveurs. Cet article explorera comment utiliser XML et JavaScript client pour afficher le contenu du fichier XML, accéder aux éléments enfants, des éléments de fonctionnement, etc.

Problèmes de compatibilité des navigateurs

Dans les langages du client, la compatibilité du navigateur est un problème majeur. Pour la combinaison de XML et JavaScript, le problème est principalement XML: tous les navigateurs ne prennent pas en charge l'analyse des documents XML.

L'exemple de code suivant est basé sur IE6. Les navigateurs qui ne prennent pas en charge XML ne peuvent pas lire ces codes, donc lors de l'affichage des fichiers XML dans ces navigateurs, le navigateur ignore toutes les balises.

Exemple de fichier XML

Ce qui suit est un exemple de fichier XML montrant les données et le chiffre d'affaires des employés de la société:

<?xml version="1.0" ?>
<company>
  <employee age="19" sex="M">Premshree Pillai</employee>
  <employee age="24" sex="M">Kumar Singh</employee>
  <employee age="21" sex="M">Ranjit Kapoor</employee>
  <turnover>
    <year>100,000</year>
    <year>140,000</year>
    <year>200,000</year>
  </turnover>
</company>
Manipuler les données de fichiers XML à l'aide de JavaScript

Chargez le fichier XML

Vous pouvez charger des fichiers XML via le code JavaScript suivant:

var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");

function loadXML(xmlFile) {
  xmlDoc.async = "false";
  xmlDoc.onreadystatechange = verify;
  xmlDoc.load(xmlFile);
  xmlObj = xmlDoc.documentElement;
}

En fait, les deux dernières lignes de la fonction sont suffisantes pour charger le fichier XML. Les deux premières lignes garantissent que toute fonction JavaScript que nous utilisons pour manipuler les données de fichiers XML par la suite ne effectuera aucune opération sur des objets non initialisés. Par conséquent, appelez Verify () Fonction:

function verify() {
  // 0 对象未初始化
  // 1 对象正在加载数据
  // 2 对象已加载数据
  // 3 可以处理对象中的数据
  // 4 对象完全初始化
  if (xmlDoc.readyState != 4) {
    return false;
  }
}

Le fichier XML peut maintenant être chargé:

loadXML('xml_file.xml');

Afficher le contenu du fichier XML

Utilisez alert(xmlObj.xml); pour afficher l'intégralité du contenu du fichier XML. L'ensemble du fichier XML sera affiché comme dans la boîte d'avertissement avec une indentation appropriée.

Éléments et nœuds subs

Dans le fichier XML ci-dessus, <company></company> est la balise de niveau supérieur, et toutes les autres balises sont en dessous. Ces balises sont appelées éléments enfants. Ce fichier XML peut être représenté graphiquement sous la forme d'un arbre de dossier:

Read and Display Server-Side XML with JavaScript Article - Part 1

Dans le fichier XML ci-dessus, la balise de niveau supérieur <company></company> a 4 éléments enfants.

Le nombre d'éléments enfants (généralement dans toutes les langues) commence à 0 (zéro). Il y a 3 éléments enfants sous la balise <turnover></turnover>.

Nous pouvons utiliser l'attribut childNodes.length pour trouver le nombre d'éléments enfants de la balise. Par conséquent, le nombre d'éléments enfants de la balise <company></company> (4 ici) se trouve via xmlObj.childNodes.length.

Le nombre d'éléments enfants de la balise

<turnover></turnover> (3 ici) se trouve via xmlObj.childNodes(3).childNodes.length.

Nous utilisons childNodes(3) ici car <turnover></turnover> est le troisième élément enfant de <company></company>.

Tester les éléments enfants

Vous pouvez utiliser childNodes(i).hasChildNodes pour tester si un élément d'enfant nœud spécifique a des éléments enfants.

Par conséquent, xmlObj.childNodes(3).hasChildNodes() reviendra vrai. xmlObj.childNodes(2).hasChildNodes() reviendra faux car la balise <employee></employee> n'a pas d'éléments enfants.

Obtenez le nom de la balise

Vous pouvez utiliser childNodes(i).tagName pour obtenir le nom de l'étiquette de l'élément enfant. Par conséquent, xmlObj.tagName renverra "Company". xmlObj.childNodes(0).tagName retournera "Employé". xmlObj.childNodes(3).childNodes(0).tagName reviendra "année".

Afficher le contenu de la balise

Dans un fichier XML, le contenu de la première balise <employee></employee> est "PremShree Pillai". Vous pouvez obtenir cette valeur en utilisant xmlObj.childNodes(0).firstChild.text.

<?xml version="1.0" ?>
<company>
  <employee age="19" sex="M">Premshree Pillai</employee>
  <employee age="24" sex="M">Kumar Singh</employee>
  <employee age="21" sex="M">Ranjit Kapoor</employee>
  <turnover>
    <year>100,000</year>
    <year>140,000</year>
    <year>200,000</year>
  </turnover>
</company>

Propriétés

Dans un fichier XML, la balise <employee></employee> a 3 propriétés. Les propriétés sont accessibles à l'aide de childNodes(i).getAttribute("AttributeName"). Par conséquent, xmlObj.childNodes(0).getAttribute("id") retournera "001". xmlObj.childNodes(1).getAttribute("age") retournera "24". xmlObj.childNodes(2).getAttribute("sex") retournera "f".

... (le contenu ultérieur, y compris la partie FAQ, peut être réécrit de la même manière, maintenir la signification d'origine et ajuster le libellé et la structure de la phrase.)

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:
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
Article précédent:Effets de la matrice jQueryArticle suivant:Effets de la matrice jQuery