我正在创建一个视频监控墙。我想尝试使用HTML5在1个网页上同时运行10个视频。但我很难编码。因此,我想使用XML创建配置文件以使用HTML5。
// so for example here is my hard coded HTML5:
<html>
<head>
<h1><u> HTML Video Tag Example </u></h1>
<style>
h1 {
text-align: center;
color: #FFFFFF;
}
#container {
background: grey;
border-radius:8px;
width:400px;
border: 5px solid grey;
padding: 0px;
margin:0px;
text-align: center;
color: white;
}
video {
height: 295px;
width: 400px;
}
</style>
<script "text/javascript">
window.oncontextmenu = function() {
return false;
}
function changeScreenSize(w,h) {
window.resizeTo( w,h )
}
</script>
</head>
<body style="background-color:#000000" onload="changeScreenSize(1300,940)">
<table border="0">
<tr>
<td>
<div id="container" > Video 1
<video width="400" height="320" controls="controls" autoplay="autoplay" loop="loop">
<source src="Sample Videos (52) - Copy.mp4-SD.mp4" type="video/mp4">
<source src="Sample Videos (52) - Copy.mp4-SD.oggtheora.ogv" type="video/ogg">
<source src="Sample Videos (52) - Copy.mp4-SD.webmhd.webm" type="video/webm">
</video>
</div>
</td>
<td>
<div id="container" > Video 2
<video width="400" height="320" controls="controls" autoplay="autoplay" loop="loop">
<source src="ArchitectVideo.ogv" type="video/ogg">
<source src="ArchitectVideo.webmhd.webm" type="video/webm">
<source src="ArchitectVideo.mp4.mp4" type="video/mp4">
</video>
</div>
</td>
<td>
<div id="container" > Video 3
<video width="400" height="320" controls="controls" autoplay="autoplay" loop="loop">
<source src="elephants-dream.webm" type="video/webm">
<source src="elephants-dream.mp4.mp4" type="video/mp4">
<source src="elephants-dream.oggtheora.ogv" type="video/ogg">
</video>
</div>
</td>
</tr>
<tr>
<td>
<div id="container" > Video 4
<video width="400" height="320" controls="controls" autoplay="autoplay" loop="loop">
<source src="big-buck-bunny_trailer.webm" type="video/webm">
<source src="big-buck-bunny_trailer.mp4.mp4" type="video/mp4">
<source src="big-buck-bunny_trailer.oggtheora.ogv" type="video/ogg">
</video>
</div>
</td>
<td>
<div id="container" > Video 5
<video width="400" height="320" controls="controls" autoplay="autoplay" loop="loop">
<source src="small.webm" type="video/webm">
<source src="small.mp4.mp4" type="video/mp4">
<source src="small.oggtheora.ogv" type="video/ogg">
</video>
</div>
</td>
<td>
<div id="container" > Video 6
<video width="400" height="320" controls="controls" autoplay="autoplay" loop="loop">
<source src="clipcanvas_14348_offline.mp4" type="video/mp4">
<source src="clipcanvas_14348_offline.webmhd.webm" type="video/webm">
<source src="clipcanvas_14348_offline.oggtheora.ogv" type="video/ogg">
</video>
</div>
</td>
</tr>
<tr>
<td>
<div id="container" > Video 7
<video width="400" height="320" controls="controls" controls poster="Snowball.png" autoplay="autoplay" loop="loop">
<source src="snowball.mp4" type="video/mp4">
<source src="snowball.webm" type="video/webm">
<source src="snowball.ogv" type="video/ogg">
</video>
</div>
</td>
<td>
<div id="container" > Video 8
<video width="400" height="320" poster="html5-video-element-test.png" controls autoplay loop>
<source src="html5-video-element-test.mp4" type="video/mp4"><!-- Better quality, so use first. -->
<source src="html5-video-element-test.webm" type="video/webm">
<source src="html5-video-element-test.ogg" type="video/ogg">
</video>
</div>
</td>
</tr>
</table>
</body>
</html>
现在,我需要使用xml创建配置文件以使用html5。所以在未来,如果我想改变一些元素,我不必去改变html5,只需更改xml文件中的元素。
<?xml version="1.0" encoding="UTF-8"?>
<xmldata>
<title><h1><u> HTML Video Tag Example </u></h1></title>
<video>
<height>280</height>
<width>400</width>
</video>
<container>
<width>400</width>
</container>
<CameraCount>7</CameraCount>
<CameraDetails>
<CameraID>Video1</CameraID>
<CameraID>Video2</CameraID>
<CameraID>Video3</CameraID>
<CameraID>Video4</CameraID>
<CameraID>Video5</CameraID>
<CameraID>Video6</CameraID>
<CameraID>Video7</CameraID>
</CameraDetails>
</xmldata>
因此,我将此元素(例如相机ID)链接到HTML5中,以便我不必对其进行硬编码。我只需要在HTML5中输入“CameraID”,然后它会立即显示视频名称。请帮忙!!! 谢谢!!
答案 0 :(得分:0)
您可以创建XSTL document。简而言之,这允许您通过定义XHTML的转换来创建自己的基于XML的文档标准。
问题(或不方便)可能如下:$link = mysql_connect('localhost', 'mysql_user', 'mysql_password');
if (!$link) {
die('Could not connect: ' . mysql_error());
}
$db_selected = mysql_select_db('foo', $link);
if (!$db_selected) {
die ('Can\'t use foo : ' . mysql_error());
}
//$from_date = $_POST['from_date'];
//$to_date = $_POST['to_date'];
$from_date = date("Y-m-d",strtotime('06/10/2015'));
$to_date = date("Y-m-d",strtotime('06/16/2015'));//$_POST['to_date'];
$query = "SELECT * FROM table WHERE from_date >= '".$from_date."' AND to_date <= '".$to_date."'";
// Perform Query
$result = mysql_query($query);
if (!$result) {
$message = 'Invalid query: ' . mysql_error() . "\n";
$message .= 'Whole query: ' . $query;
die($message);
}
while ($row = mysql_fetch_assoc($result)) {
print_r($row);
}
标记不是XHMTL标准的一部分,而只是HTML 5的一部分。我仍然假设大多数浏览器在使用时仍应显示您的视频XSTL。
答案 1 :(得分:0)
你的XML文件不清楚,是的。我会创建类似的东西:
<?xml version='1.0' encoding='utf-8'?>
<root>
<video>
<name>Lions eating</name>
<width>400</width>
<height>300</height>
<url>https://www.youtube.com/watch?v=VECtHHQjCqg</url>
<CameraID>0101010</CameraID>
</video>
<video>
<name>Zebras eating</name>
<width>400</width>
<height>300</height>
<url>https://www.youtube.com/watch?v=2y4QByEFw5U</url>
<CameraID>0202020</CameraID>
</video>
</root>
然后,您可以使用DOMDocument
解析器,使用load()
函数加载XML文件,然后getElementsByTagName()
选择并将其打印为HTML。
参考: