motivation:
Passons maintenant à un petit exemple d'application de XML dans IE : résoudre le problème de liaison des menus déroulants doubles. L'exemple le plus courant consiste peut-être à sélectionner une province, puis à modifier les options de ville. Essayons donc d'utiliser XML pour le compléter.
Certaines des fonctions que j'ai présentées précédemment ont été implémentées directement à l'aide de fichiers XML+XSL. Vous n'êtes peut-être pas très familier avec son utilisation, j'utiliserai donc HMTL+XML cette fois, dans l'espoir de donner à tout le monde une compréhension plus claire--" XML peut l'être. simple!" :)
Matériel:
Il existe 2 fichiers liés au menu de sélection de volume XML : Citys.xml et CitySelect.htm.
Les fonctions sont :
Après avoir sélectionné une province, la ville correspondante peut être automatiquement affichée, ce qui est pratique pour les utilisateurs, améliore efficacement l'interaction des données et rend votre page plus colorée.
Effet:
Parcourez ici
Code:
Villes.xml
État>
État>
État>
État>
État>
État>
Fonction personnalisée
CitySelect.htm
: ChooseState
(Lisez le nom de la province dans les données XML et ajoutez-le à la liste déroulante de SelState)
fonctionChooseState()
{
source variable ;
var nomsource = "Villes.xml";
var source = new ActiveXObject('Microsoft.XMLDOM'); //Créer une instance d'analyseur MSXML
source.async = false ;
source.load(sourceName); //Charger le document XML
root = source.documentElement; //Définit l'élément de document comme élément de nœud racine
sortField=root.selectNodes(" //@name "); //Recherche tous les nœuds dont les attributs contiennent un nom
for(var i=0;i
var oOption = document.createElement('OPTION');
oOption.text = " "+sortField[i].text+" ";
oOption.value = sortField[i].text;
form1.SelState.options.add(oOption);
}
ChoisirCity();
}
Fonction personnalisée : ChooseCity
(Lisez le nom de la ville correspondant dans les données XML en fonction du nom de la province actuellement sélectionnée et ajoutez-le à la liste déroulante SelCity)
fonctionChooseCity()
{
x=form1.SelState.selectedIndex; //Lire les options actuelles de la liste déroulante Province
y=form1.SelState.options[x].value;
sortField=root.selectNodes("//State[@name='"+y+"']/City&q uot;); //Recherche tous les nœuds de ville sous le nœud State dont la valeur d'attribut de nom est égale au paramètre y
for(var i=form1.SelCity.options.length-1;i>=0;--i) //Annuler l'élément de liste d'origine
{
form1.SelCity.options.remove(i)
}
for(var i=0;i
var oOption = document.createElement('OPTION');
oOption.text = " "+sortField[i].text+" ";
oOption.value = sortField[i].text;
form1.SelCity.options.add(oOption);
}
}
Code source du formulaire
Post-scriptum :
Lorsque j'ai commencé à apprendre XML, j'avais la même confusion que tout le monde : « J'ai appris XML, mais comment dois-je l'utiliser ? Cette question me gêne depuis longtemps, très longtemps...
Parce que le e-commerce ? et le développement de logiciels sont mon expertise, j'ai pensé qu'il serait préférable de commencer par ce que je connais le mieux. J'ai donc implémenté certaines des fonctions les plus couramment utilisées dans la construction de sites Web en XML. Vous pouvez le faire aussi !