2017-01-30 85 views
0

我想从XML文档中获取多个标签。我查看了this question,它基本上获得了一个标签的子元素,而我想要所有的标签。使用同一示例XML(下面复制):jquery为多个标签解析xml

var data = 
"<root> 
    <instructions>Some ins text.</instructions> 
    <options> 
     <option>1.png</option> 
     <option>2.png</option> 
     <option>3.png</option> 
     <option>4.png</option> 
    </options> 
    <noOfOptions>4</noOfOptions> 
</root>"; 

如何获取的值“指令”,“选项”和“noOfOptions”?

我可能只是重复的代码三次这样的:

xml = $.parseXML(data), 
$data = $(xml), 
$options = $data.find("option"); // get all option nodes 

xml = $.parseXML(data), 
$data = $(xml), 
$instructions = $xml.find("instructions"); // get instructions 

xml = $.parseXML(data), 
$data = $(xml), 
$noOfOptions = $xml.find("noOfOptions"); // get noOfOptions 

但是,这看起来不正确。有没有一个正确的(和更有效的)方式来做到这一点?我认为.each函数与它有关,但并不真正了解如何使用它。

+0

是否只有一个'指令'和多重'选项'? –

+0

不一定。事实上,大多数时候,我不需要走下一个关卡。 – Chiwda

+0

我很担心“说明”的数量,因为在我的答案中,我认为只会有一个。如果它可能更多,那么你应该为它们制作一个数组,就像'选项'一样。 –

回答

2

var data = 
 
"<root>\ 
 
    <instructions>Some ins text.</instructions>\ 
 
    <options>\ 
 
     <option>1.png</option>\ 
 
     <option>2.png</option>\ 
 
     <option>3.png</option>\ 
 
     <option>4.png</option>\ 
 
    </options>\ 
 
    <noOfOptions>4</noOfOptions>\ 
 
</root>"; 
 

 

 
var xml = $.parseXML(data); 
 
var $data = $(xml); 
 

 
var instructions = $data.find("instructions").text(); 
 
var options = []; 
 
$data.find("option").each(function(){ 
 
    options.push($(this).text()); 
 
}); 
 

 
console.log("instructions: " + instructions); 
 
console.log("options: ", options);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

1

如果你的结构是固定的,你可以试试这个:

var data = 
"<root>"+ 
    "<instructions>Some ins text.</instructions>"+ 
    "<options>"+ 
     " <option>1.png</option>"+ 
     "<option>2.png</option>"+ 
     " <option>3.png</option>"+ 
     " <option>4.png</option>"+ 
    " </options>"+ 
    " <noOfOptions>4</noOfOptions>"+ 
    "<instructions>Some ins text1.</instructions>"+ 
    "<options>"+ 
    " <option>1.png</option>"+ 
     "<option>2.png</option>"+ 
    " <option>3.png</option>"+ 
    " <option>4.png</option>"+ 
    " </options>"+ 
    " <noOfOptions>4</noOfOptions>"+ 
"</root>"; 
xml = $.parseXML(data); 
var arr=[]; 
    var arr=[]; 
    $("instructions", xml).each(function (index,val) { 

     arr[index]=[]; 
     arr[index]['instructions']=$(this).text(); 
     arr[index]['option']=[]; 
     $("option",$(val).next()).each(function(){ 
      arr[index]['option'].push($(this).text()); 
     }); 
     arr[index]['noOfOptions']=[]; 
     arr[index]['noOfOptions']=$($(val).next()).next().text(); 

     }); 
    console.log(arr); 

控制台输出:

[数组[0],数组[0] 0:数组[0]指令: “一些插件的文本。” 长度: 0noOfOptions: “4” 选项:数组[4] :数组[0] 1:阵列[0]长度: 2__proto__:数组[0]

Fiddle

如果需要(可以VBE转换在jquery的阵列/对象)的整个数据为JSON可以使用:xml2json