Javascript 如何基于xml数据移动表中的单元格？_Javascript_Php_Html_Css_Xml

Javascript 如何基于xml数据移动表中的单元格？

javascript php html css xml

Javascript 如何基于xml数据移动表中的单元格？,javascript,php,html,css,xml,Javascript,Php,Html,Css,Xml,我正在用html在表格中创建一个电视动画指南。我有一个包含所有数据（如名称、开始时间、结束时间等）的xml文件。我希望表格中的单元格位于html表格中xml文件数据显示的开始时间和结束时间之间的正确位置。我该怎么做？该表仅显示时间，如上午9点、上午10点……但如下表所示，一集可能在9:30至10:30之间开始。例如，对泰坦的攻击从9点30分开始，到10点30分结束，死亡笔记从下午12点开始，到下午1点结束。我在想如何通过表格单元格中的id来实现，但我不知道如何实现如何仅通过从xml文件中获取信

我正在用html在表格中创建一个电视动画指南。我有一个包含所有数据（如名称、开始时间、结束时间等）的xml文件。我希望表格中的单元格位于html表格中xml文件数据显示的开始时间和结束时间之间的正确位置。我该怎么做？该表仅显示时间，如上午9点、上午10点……但如下表所示，一集可能在9:30至10:30之间开始。例如，对泰坦的攻击从9点30分开始，到10点30分结束，死亡笔记从下午12点开始，到下午1点结束。我在想如何通过表格单元格中的id来实现，但我不知道如何实现

如何仅通过从xml文件中获取信息就将单元格（动画程序）放置在特定时间下？

请参见下面的示例：

以下是XML文件：

<?xml version="1.0" encoding="UTF-8"?><anime_data>
<anime id="1">
<action_adventure_channel>
    <name>Attach on Titan</name>
    <start_time>09.30am</start_time>
    <end_time>10.30am</end_time>
</action_adventure_channel>
</anime>
<anime id="2">
<crime_drama_channel>
    <name>Death Note</name>
    <start_time>12.00pm</start_time>
    <end_time>1.00pm</end_time>
</crime_drama_channel>
</anime></anime_data>


附在泰坦上
上午9时30分
上午10:30
死亡笔记
下午12时
下午1时

以下是HTML文件：

<!DOCTYPE html>

<html><head><title>Anime</title>
<link rel="stylesheet" type="text/css" href="anime.css">
</head>
<body>
<table style="width:100%">
  <tr>
    <th class = "table-main">Channel</th>
    <th class = "time" id ="9.00am">9AM</th>
    <th class = "time" id ="9.30am"></th>
    <th class = "time" id ="10.00am">10AM</th>
    <th class = "time" id ="10.30am"></th>
    <th class = "time" id ="11.00am">11AM</th>
    <th class = "time" id ="11.30am"></th>
    <th class = "time" id ="12.00pm">12PM</th>
    <th class = "time" id ="12.30pm"></th>
    <th class = "time" id ="1.00pm">1PM</th>

  </tr>

  <tr>
    <td class = "table-main">Action/Adventure</td>
    <td>
    <?php
        $xml=simplexml_load_file("anime.xml") or die("Error: Cannot create object");
        echo $xml->anime[0]->action_adventure_channel->name;        
    ?>


    </td>
  </tr>
  <tr>
    <td class = "table-main">Crime/Drama</td>
    <td>
    <?php
        $xml=simplexml_load_file("anime.xml") or die("Error: Cannot create object");
        echo $xml->anime[1]->crime_drama_channel->name;     
    ?>
    </td>
  </tr>
</table>
</body>
</html>


动漫
频道
上午9点
上午10点
上午11点
下午12点
下午1点
行动/冒险
动漫[0]->动作冒险频道->名称；
?>
犯罪/戏剧
动漫[1]->犯罪电视剧频道->名称；
?>

我认为最简单的方法是使用div和span

<div>
    <span style="width: 100px;">action...</span>
    <span style="width:xxxx; margin-left:yyyyy;">attack on...</span>

</div>


行动。。。
攻击。。。

然后，你必须计算widht xxxx和左边yyyy的边距，以显示右边位置的元素。

你能发表一篇提琴作品吗？嗨，卡尔，这是一道题中的几个问题。尝试分解它们，正确标记它们，并展示您尝试过的内容。你会得到更多的关注和答案，所以。没关系，我试着自己做这件事。谢谢大家！没关系，我试着自己去做。谢谢大家！