使用 JQuery 从 XML 中提取图像链接答案

【问题标题】：Extract image link from XML with JQuery使用 JQuery 从 XML 中提取图像链接
【发布时间】：2012-07-20 18:00:30
【问题描述】：

我有一些 JavaScript 应该使用以下代码从 XML 文档中获取此图像 URL[1]。然而，Chrome 的控制台在这一行返回Uncaught TypeError: Cannot read property '1' of null。正则表达式不正确吗？

var image = $(post.description.match(/<br\/>(<a.*><img.*<\/a>)<br\/>/)[1]).addClass('photo');

[1]http://photos-c.ak.fbcdn.net/hphotos-ak-ash4/391316_483838581645230_1080523933_s.jpg

XML 的结构如下：

<description>
<![CDATA[
Extendemos una cordial felicitación a Reserva de la Biosfera Banco Chinchorro que celebra su aniversario el día de hoy.
Un especial saludo a Maricarmen García, Directora de la Reserva y Líder 2010 del Programa de Liderazgo. ¡Estamos muy
orgullosos de su trabajo!<br /> <br /> We would like to co
]]>
<![CDATA[
ngratulate Banco Chinchorro Biosphere Reserve who is celebrating their anniversary today. A special greeting to Maricarmen
García, the Reserve&#039;s Director and 2010 MAR Leadership Fellow. We are so proud of your work!<br /> <br />
<a href="http://pyucatan.conanp.gob.mx/chincho.htm" target="_blank" rel="nofollow nofollow"
onmousedown="UntrustedLink.bootstrap($(this), &quot;HAQE2sh3f&quot;, event, bagof({}));">http://pyucatan.conanp.gob.mx/chincho.htm</a><br/><br/>
<a href="http://www.facebook.com/photo.php?fbid=483838581645230&amp;set=a.167790786583346.41662.123942950968130&amp;type=1&amp;relevant_count=1"
title="" target=""><img class="img" src="http://photos-c.ak.fbcdn.net/hphotos-ak-ash4/391316_483838581645230_1080523933_s.jpg" alt="" /></a>
]]>
</description>

【问题讨论】：

因为图像 URL 在节点内的字符串中，所以我仍然需要解析它。
@AlvinWong：是否需要转义 CDATA 部分中的内容？
@Simpleton 你能指出你想要完全匹配的内容吗？（提取示例中您尝试提取的部分...）
@AlvinWong：为什么？ >/
@AlvinWong 试图匹配标记为 [1] 的问题中指出的 img src

标签： javascript jquery xml image

【解决方案1】：

正则表达式不正确吗？

是的。 /<br\/>(<a.*><img.*<\/a>)<br\/>/ 尝试匹配不带空格的 br-tags，而且在您给我们的字符串中，链接后没有 <br>。因此，匹配返回 null 并且没有属性“1”。

无论如何，Regex is not suited 完成这项任务。只需获取 <description> 节点的 textContent，使用 jQuery 将其解析为 HTML（参见 Can jQuery Parse HTML Stored in a Variable?），甚至使用 jQuery.parseXML 解析为 X[HT]ML，然后使用 selector to get a > img 元素出来，为了读取src属性。

【讨论】：

【解决方案2】：

正则表达式是big no-no 的parsing HTML/XML。

你应该尝试用jQuery.parseXML()解析

【讨论】：

HTML 不需要是 XML