Question

我需要将xml doc读入网页。我正在使用ajax但是在读取数据时遇到了问题。这是我的代码：

function getXML() {
    var newURL = "https://www.youtube.com/api/timedtext&v=5Ovh9KJ25ow&lang=en";
    $(document).ready(function() {
        $.ajax({
            type: "GET",
            url: newURL,
            dataType: "xml",
            success: xmlParser
        });
    });

    function xmlParser(xml) {
        $(xml).find("text").each(function() {
            alert('hi');
            $("#caption").append('<div>' + $(this).find("text").text() + '</div>');
        });
    }
}

在网页正文中，我<div id="caption"></div>。如果您查看该网址https://www.youtube.com/api/timedtext?&v=5Ovh9KJ25ow&lang=en，您会看到它是带有“文本”节点的xml文档。这些节点还包括我将需要的“开始”属性。我把一个javascript警报（'hi'）只是为了查看它是否正在运行，我对19个文本节点按预期得到“hi”19次，但没有任何内容写入我的div。一旦我显示数据，如何访问“开始”属性数据？

Answer 1

问题是您使用的是$(this).find("text").text()而不是$(this).text()。

function xmlParser(xml) {
  $(xml).find("text").each(function() {
    $("#caption").append('<div>' + $(this).text() + '</div>');
  });
}

function xmlParser(xml) {
  $(xml).find("text").each(function() {
    $("#caption").append(
      '<li>' +
        '<p>Text: ' + $(this).text() + '</p>' +
        '<p>Start (jQuery way): ' + $(this).attr('start') + '</p>' + 
        '<p>Start (JavaScript way): ' + this.getAttribute('start') + '</p>' + 
      '</li>'
    );
  });
}

xmlParser(`<transcript>
<text start="0.01" dur="4.04">{music}</text>
<text start="4.07" dur="4.04">
What is the One Button Studio? The One Button Studio is simply
</text>
<text start="8.13" dur="4">
a standard video recording studio where we&#39;ve removed the technology from
</text>
<text start="12.15" dur="4.01">
the floor and mounted it to the ceiling and we&#39;ve also automated the space.
</text>
<text start="16.18" dur="4">
We did this to enhance the user experience. You no longer need to know how to work
</text>
<text start="20.2" dur="4.08">
lights, camera, or audio to create a good quality video.
</text>
<text start="24.3" dur="4.09">
To work it, we just bring a thumb drive and we simply plug it into the hub here.
</text>
<text start="28.41" dur="4.12">
And within a few seconds, we&#39;re gonna see ourselves on the
</text>
<text start="32.55" dur="4.08">
monitor and the lights will come on, and we&#39;re ready to go. To start, we
</text>
<text start="36.65" dur="4.01">
simply press the button. We get a five second countdown. If we so choose,
</text>
<text start="40.68" dur="4.08">
we can use a projector to project an image or we can use the green screen on the ceiling to
</text>
<text start="44.78" dur="4.02">
shoot a standard green screen video. And once we&#39;ve created our video,
</text>
<text start="48.82" dur="4.06">
we just simply press the button again. It will save that video
</text>
<text start="52.9" dur="4.02">
to a QuickTime formatted file right to the thumb drive. And when it&#39;s finished,
</text>
<text start="56.94" dur="4.03">
we can just take that thumb drive out, everything will turn off, and we&#39;re ready to go.
</text>
<text start="60.99" dur="4">{music}</text>
<text start="65.01" dur="4.04"></text>
<text start="69.07" dur="4.01"></text>
<text start="73.1" dur="2.668"></text>
</transcript>`)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="caption"></ul>

无法将xml数据读入网页

1 个答案: