Javascript 如何在解析xml文件时替换此处接收到的值

我有以下xml文件

<categories>

  <category id="2" name="Pepsi" >
     <products>
      <product id="858" name="7UP" price="24.4900" />
      <product id="860" name="Aquafina" price="24.4900" />
      </products>
  </category>

  <category id="4" name="Coke" >
     <products>
      <product id="811" name="ThumpsUp" price="24.4900" />
      <product id="813" name="Maaza" price="24.4900" />
    </products>
  </category>

 </categories>

请看这里的JSFIDLE

如何使用解析xml时收到的category元素创建activateUi.newPanel.html

activateUi.newPanel.html(" \
                    <h3><a href='#'>First</a></h3> \
                    <div></div> \
                    <h3><a href='#'>Second</a></h3> \
                    <div></div> \
                    <h3><a href='#'>Third</a></h3><div></div>")

activateUi.newPanel.html（“\
\
\
\
\
")

您可以这样做：

var names = []; //make an empty array to store the category names
$(xmldocu).find("category").each(function () {
    names.push($(this).attr('name')); //add each category name to the array
});

var activateUiHTML = $("<div></div>"); //make an empty div to store the new HTML
for (var i = 0; i < names.length; i++) {
    // loop through each name, and create the desired markup for each category name
    activateUiHTML.append("<h3><a href='#'>" + names[i] + "</a></h3><div></div>");
}

activateUi.newPanel.html(activateUiHTML); //set the new markup as the html

var name=[]//创建一个空数组来存储类别名称
$（xmldocu）.find（“category”）.each（函数（）{
names.push（$（this.attr（'name'））；//将每个类别名称添加到数组中
});
var activateUiHTML=$（“”）//创建一个空div来存储新的HTML
对于（var i=0；i

谢谢你的回答，但它破坏了现有的功能如果你看到我的，如果我把你的代码放在里面，手风琴不会显示出来。我写的答案是基于你在问题中提供的信息。看起来不错，但是嵌套的手风琴无法根据需要创建手风琴。您还不清楚您在这里到底想做什么。我觉得我最初的回答足以回答你提出的问题。祝你好运。

var names = []; //make an empty array to store the category names
$(xmldocu).find("category").each(function () {
    names.push($(this).attr('name')); //add each category name to the array
});

var activateUiHTML = $("<div></div>"); //make an empty div to store the new HTML
for (var i = 0; i < names.length; i++) {
    // loop through each name, and create the desired markup for each category name
    activateUiHTML.append("<h3><a href='#'>" + names[i] + "</a></h3><div></div>");
}

activateUi.newPanel.html(activateUiHTML); //set the new markup as the html