在XML数据库中查找对象,将其信息提供给相关的DOM元素

时间:2015-05-14 05:00:44

标签: javascript jquery ajax xml

道歉,如果标题没有多大意义;我对此有点新意,不确定用它来说最聪明的方法是什么。

我的页面顶部有一排电影海报。点击其中一个应该:

  • 使用AJAX打开XML文件
  • 在XML文件中查找与点击的电影海报同名的对象
  • 使用XML对象中的电影信息
  • 填充页面中的“模板”

以下是XML的示例摘录:

<movies>
<movie name="se7en">
    <title>Se7en</title>
    <quote>Ernest Hemingway once wrote;<br>“The world is a fine place and worth fighting for.”<br>I agree with the second part.</quote>
    <showing>AUG 28, 3:45PM</showing>
    <rating>R</rating>
    <year>1995</year>
    <length>127 Minutes</length>
    <genre>Thirller</genre>
    <staring1>Brad Pitt</staring1>
    <staring2>Morgan Freeman</staring2>
    <staring3>Gwyneth Paltrow</staring3>
    <staring4></staring4>
    <slogan>7 deadly sins. 7 ways to die.</slogan>
    <synopsis><p>Set in a hellish vision of a New York-like city, where it is always raining and the air crackles with impending death, the film concerns Detective William Somerset (Morgan Freeman), a homicide specialist just one week from a well-deserved retirement.</p><p>But Somerset’s retirement must wait for one last case, for which he is teamed with young hotshot David Mills (Brad Pitt), the fiery det­ective set to replace him at the end of the week. Mills has talked his reluctant wife, Tracy (Gwyneth Paltrow), into moving to the big city so that he can tackle important cases, but his first and Somerset’s last are more than either man has bargained for. A diabolical serial killer is staging grisly murders, choosing victims representing the seven deadly sins. Somerset initially refuses to take the case, realizing that there will be five more murders, ghastly sermons about lust, sloth, pride, wrath, and envy presented by a madman to a sinful world. But something within him cannot let the case go, forcing the weary detective to team with Mills and see the case to its almost unspeakably horrible conclusion.</p></synopsis>
</movie>
<movie name="thegame">
    <title>The Game</title>
    <quote>foobar</quote>
    <showing>foobar</showing>
    <rating>foobar</rating>
    <year>foobar</year>
    <length>foobar</length>
    <genre>foobar</genre>
    <staring1>foobar</staring1>
    <staring2>foobar</staring2>
    <staring3>foobar</staring3>
    <staring4>foobar</staring4>
    <slogan>foobar</slogan>
    <synopsis>foobar</synopsis>
</movie>
</movies>

因此,当点击电影海报“se7en”时,我需要在xml文档中找到名为“se7en”的电影对象。然后,我将获取“se7en”对象下的<title>标记的内容,并将其放入相关的DOM元素中。然后,获取“se7en”对象下的<quote>标签的内容,并将其放入相关的DOM元素等中。

所以,我通过

设置了AJAX请求
var noSpace = $(this).attr('data-title').replace(/\W/g,'').toLowerCase();

var movieReq = new XMLHttpRequest();
movieReq.open("GET","movies.xml?m="+noSpace,true);
movieReq.send();
movieXML = movieReq.responseXML;

noSpace是我们将在XML中搜索相关<movie>对象的电影海报名称

但是,如何在movieXML中搜索<movie name=noSpace>并提取其信息?

正如我所提到的,我之前从未做过XMLHttpRequest,并且无法理解它是如何工作的。有没有更好的方法来完成我正在尝试的整体任务?我应该使用JSON而不是XML吗?我不知道这是如何做得最好的。

我有使用

从HTML文档加载div的经验
$('#xyz').load('foo.html #bar');

,但我不确定这是否适用于我在这里所做的事情。

0 个答案:

没有答案