如何使用 jQuery 解析 XML 并将内容插入 HTML 表单？答案

【问题标题】：How to parse XML and insert content into HTML form using jQuery?如何使用 jQuery 解析 XML 并将内容插入 HTML 表单？
【发布时间】：2009-09-14 14:17:55
【问题描述】：

我有一个带有图像标签的简单 XMl 文件：

XML：

<img src="images/image1" alt="My Image 1" />
<img src="images/image2" alt="My Image 2" />
<img src="images/image3" alt="My Image 3" />
<img src="images/image4" alt="My Image 4" />

我需要在我的 HTML 表单中的 <div> 标记内插入此内容（“src”属性）。

HTML：

<div id="photos">
</div>

有谁知道如何使用 jQuery 做到这一点？

提前致谢。

【问题讨论】：

为什么将其存储在 xml 文件中？这只是 html。

标签： jquery html xml insert parsing

【解决方案1】：

既然你的 xml 文件包含有效的 html 标记，为什么不直接把它塞进你的 div 中呢？

$('#photos').load('TheFile.xml')

【讨论】：

短小精悍，但假定 XML 文件只包含 img 标签。如果它实际上包含一个完整的 XML 文档，那么@easement 发布的解决方案会更可取。

【解决方案2】：

类似的东西呢：

<script type="text/javascript">
function imageData() {
    //first we need to load the XML data for that detail row
    //if the function is a success it will call the function called processDetail
    $.ajax({
       type: "GET",
       url: "PATH_TO_XML_GOES_HERE",
       dataType: "xml",
       success: getImages
     });
}

function getImages(xml) {
    //this function gets the results from the xml file
    //and inserts them in to the boxes
    $(xml).find("img").each(function()   {
        $("#photos").append(this);
    });
}
</script>

这里的黑客形式：http://www.getdowntonight.co.uk/2009/08/using-xml-in-your-jquery-to-populate-input-boxes/

可能不起作用，但看起来它可以让您顺利上路。

【讨论】：