motivação:
Agora vamos fazer um pequeno exemplo de aplicação de XML no IE: resolvendo o problema de ligação de menus suspensos duplos. Talvez o exemplo mais comum seja selecionar uma província e depois alterar as opções de cidade, então vamos tentar usar XML para completá-lo.
Algumas das funções que apresentei anteriormente foram implementadas diretamente usando arquivos XML+XSL Você pode não estar muito familiarizado com seu uso, então usarei HMTL+XML desta vez, esperando dar a todos uma compreensão mais clara--" XML pode ser assim. simples!" :)
Material:
Existem 2 arquivos vinculados ao menu de seleção de volume XML: Citys.xml e CitySelect.htm
As funções são:
Depois de selecionar uma província, a cidade correspondente pode ser exibida automaticamente, o que é conveniente para os usuários, melhora efetivamente a interação dos dados e torna sua página mais colorida.
Efeito:
Navegue aqui
Código:
Cidades.xml
Função personalizada
CitySelect.htm
: ChooseState
(Leia o nome da província nos dados XML e adicione-o à lista suspensa do SelState)
funçãoChooseState()
{
fonte var;
var sourceName = "Cidades.xml";
var source = new ActiveXObject('Microsoft.XMLDOM'); //Cria uma instância do analisador MSXML
fonte.async = falso;
source.load(sourceName); //Carrega documento XML
root = source.documentElement; //Definir o elemento do documento como o elemento do nó raiz
sortField=root.selectNodes(" //@name "); //Pesquise todos os nós cujos atributos contenham nome
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);
}
EscolhaCidade();
}
Função personalizada: ChooseCity
(Leia o nome da cidade correspondente nos dados XML com base no nome da província atualmente selecionada e adicione-o à lista suspensa SelCity)
funçãoEscolherCidade()
{
x=form1.SelState.selectedIndex; //Lê as opções atuais da caixa suspensa da província
y=form1.SelState.options[x].valor;
sortField=root.selectNodes("//State[@name='"+y+"']/City&q uot;); //Pesquise todos os nós da cidade sob o nó State cujo valor do atributo name seja igual ao parâmetro y
for(var i=form1.SelCity.options.length-1;i>=0;--i) //Desfaz o item original da lista
{
formulário1.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);
}
}
Código fonte do formulário
Pós-escrito:
Quando comecei a aprender XML, tive a mesma confusão que todo mundo - "Aprendi XML, mas como devo usá-lo? Essa pergunta me atrapalha há muito, muito tempo...
Porque e-commerce?
"e desenvolvimento de software são minha especialidade, achei que seria melhor começar com o que estou mais familiarizado. Então implementei algumas das funções mais utilizadas na construção de sites em XML. Você também pode fazer isso!