如何从xml中提取特定内容（在页面加载时）？

Question

我正在处理如下所示的html / js代码，属于以下url，其中黑色的所有内容都来自xml

<div class="container-wrap background--gray-light-2 cf">
    <div class="section container container--mid container--margbot background--white entry-content cf">
        <script src="https://content.jwplatform.com/libraries/FZ8yNTef.js"></script>
        <center>
            <div id="podcast" align="center"></div>
        </center>
        <script>
            var PodcastplayerInstance = jwplayer("podcast");
            PodcastplayerInstance.setup({
                playlist: "//www.cpac.ca/tip-podcast/jwplayer.xml",
                androidhls: true,
                preload: "auto",
                height: 200,
                width: 400,
                visualplaylist: false,
                stretching: "fill",
                "plugins": {
                    "http://www.cpac.ca/tip-podcast/listy.js": {},
                    'viral-2': {'oncomplete': 'False', 'onpause': 'False', 'functions': 'All'}
                }
            });
        </script>
    </div><!-- .entry-content -->
</div><!-- .container-wrap -->

问题陈述：

我想知道我需要在上面添加什么php / javascript代码，以便它只获取2019年4月3日或2019年4月1日，或者仅从一个内容（如下所示）从这里的垂直矩形框中输入页面加载http://www.cpac.ca/en/episode/

此时，从xml中拉出5个内容（在黑色矩形框中）。

使用以下逻辑从xml中提取特定内容：

 $context  = stream_context_create(array('http' => array('header' => 'Accept: application/xml')));
 $url = 'http://www.cpac.ca/tip-podcast/jwplayer.xml';

 $xml = file_get_contents($url, false, $context);
 $xml = simplexml_load_string($xml);
 $itemarray = $xml->xpath("/rss/channel/item[1]");

我想知道如何将它与上面的html / js代码集成。项目数组的值（1,2,3,4,5）可以根据需要进行混洗。

Answer 1

JavaScript解决方案

你可以使用JW PLayer playlist API，你可以使用jwplayer().getPlaylistItem()只检索播放列表中的特定项目。在你的情况下，jwplayer()是PodcastplayerInstance，并注意索引是从0开始的。所以你可以在调用PodcastplayerInstance.setup()之后添加它：

var item = PodcastplayerInstance.getPlaylistItem(0);
console.log( item.title, item.description, item ); // for debugging/testing purposes

你可以使用jQuery（在写作时 - 在page上使用）更新“垂直矩形框”（基于当前标记），在div#podcast_listy_pl_panel中：

var $item = jQuery( '#podcast_listy_pl_panel .listy-item' );
$item.find( '.listy-title' ).html( item.title + ' <span class="listy-duration"></span>' );
$item.find( '.listy-description' ).html( item.description );

要获得第二个，第三个等项目，只需更改索引：

var item = PodcastplayerInstance.getPlaylistItem(1); // get the second item; index = 1

PHP解决方案

你已经有了获取远程XML file内容的代码，所以你可以在下面定义$itemarray的地方添加它（即在以下行之后：$itemarray = $xml->xpath("/rss/channel/item[1]");）：

$item = $itemarray ? (array) $itemarray[0] : null;
if ( $item ) :
?>
<div class="listy-textwrapper">
    <span class="listy-title">
        <?php echo $item['title']; ?>
        <span class="listy-duration"></span>
    </span>
    <span class="listy-description">
        <?php echo $item['description']; ?>
    </span>
</div>
<?php
endif; // end $item

要获得第二项，只需像这样使用item[2]：

$itemarray = $xml->xpath("/rss/channel/item[2]"); // get the second item; index = 2, not 1

但这里的$item总是指向$itemarray[0]：

$item = $itemarray ? (array) $itemarray[0] : null;