отображать XML-данные в формате HTML из XML-файла, указанного в другом XML-файле с помощью xmlhttprequest - PullRequest
0 голосов
/ 01 сентября 2010

Можете ли вы помочь, у меня есть базовый XML-файл, который хорошо отображается в HTML.

XML-файл как таковой ...

<videoList>
        <video>
            <pointer>
                <type><![CDATA[image]]></type>
                <lat><![CDATA[52.1]]></lat>
                <long><![CDATA[1.0]]></long>
            </pointer>
            <speaker>
                <firstName><![CDATA[Mr Car Dealer]]></firstName>
                <town><![CDATA[]]></town>
                <description><![CDATA[Car Dealer]]></description>
                <longDescription><![CDATA[A car dealer selling BMW's and Audi's]]></longDescription>
                <videoCaption><![CDATA[captions/bmw.xml]]></videoCaption>
                <video><![CDATA[video/9ADA1C9.flv]]></video>
                <story><![CDATA[]]></story>
                <picture><![CDATA[images/bmw.jpg]]></picture>
            </speaker>
        </video>

Все отображается хорошо, кромеданные в теге <videoCaption> - это ссылка на другой XML-файл, который состоит из следующих элементов:

<?xml version="1.0" encoding="utf-8"?>
<tt xml:lang="en" xmlns="http://www.w3.org/2006/04/ttaf1" xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling">
  <head>
   <styling>
      <style id="1" tts:textAlign="right"/>
      <style id="2" tts:color="transparent"/>
      <style id="3" style="2" tts:backgroundColor="white"/>
      <style id="4" style="2 3" tts:fontSize="10"/>
   </styling>
  </head>
  <body>
   <div xml:lang="en">
    <p begin="00:00:00.20" dur="00:00:02.00">My name is Mr Car.</p> 
    <p begin="00:00:02.30" dur="00:00:03.00">We offer original car parts.</p>

</div>
</body>
</tt>

Что я пытаюсь сделать безуспешно, так это отобразить данные из второгоXML-файл рядом с соответствующими данными, в первом XML-файле содержится около 10 записей, каждая из которых ссылается на отдельный XML-файл в теге <videoCaption>.

До сих пор мне удалось отобразить 2-йXML-файл в iFrame, но я не могу стилизовать его с помощью CSS, также он не работает в Firefox.

В настоящее время я отображаю данные в формате HTML с помощью метода spree Dreamweaver.

У меня был очень хороший ответ ....

В двух словах, я бы взял 2-й XML-файл (предположим, что он находится в том же домене) через xmlhttprequest, а затем вставил егов должным образом расположенный DIV.

Это шay стили CSS все еще будут доступны для него, что, по-видимому, не так, если вы используете iframe.

Каков наилучший способ использования xmlhttprequest с текущим рабочим html?Я настроил таблицу для отображения xml, и я включил XMLHttpRequest.js, но у меня нет радости, отображая фактические данные из 2-го файла ....

<table width="600" border="0" align="center" cellpadding="0" cellspacing="14" class="storyContainerBack">
<tr>
   <td width="144" align="left" valign="top">{firstName}<br />
    {description}<br />
     <br />
       <img src="{picture}" width="80" height="80"/></td>
          <td width="424" align="left" valign="top"><p class="storyTableTitle">{longDescription}</p>
        <p class="storyTableCaption">
<script type="text/javascript">
var req = new XMLHttpRequest(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4 && (req.status == 200 || req.status == 304)) { alert(req.responseText); } }; req.open('GET', '{videoCaption}'); req.send(null); } 
    </script>
</p>
</td>

Если кто-нибудь может пролить свет на то, как я отображаю результаты 2-го XML-файла, это было бы здорово.

Спасибо

1 Ответ

0 голосов
/ 01 сентября 2010

Это может сработать (не проверено, поэтому могут возникнуть незначительные синтаксические проблемы), и вы поместите его под TABLE разметкой:

function getVideoChild() {
    var req = new XMLHttpRequest();
    req.open("GET", "whatever-file-name-is.xml");
    req.onload = function() {

       var result = req.responseText; 
           // If you need to manipulate result, do it here, then this:
       var target = document.getElementsByClassName('storyTableCaption')[0].innerHTML = result;

    };
    req.send();
}

Я переместил это за пределы разметки, так как запрос AJAX требует времениdocument.write(result); не будет хорошей идеей.

Во-вторых, может быть проще присвоить окружающей разметке для XML значение ID, поэтому вам не нужно делать getElementsByClassName и смотретьдля первого результата в массиве результатов.

Наконец, я не уверен, что вы работаете с XML, чтобы он отображался на вашей веб-странице, но если вам нужно что-то сделать, я указал хорошийместо в коде комментариев.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...