使用JavaScript进行查询，以便在HTML文档中按日期显示事件

Query using JavaScript to display events by date in HTML document

本文关键字：文档 HTML 日期 事件 显示 JavaScript 查询 使用      更新时间：2023-09-26

我是javascript新手，需要帮助。我不确定我应该使用AJAX还是Xquery。

我有一个XML文件，我想按日期和建筑提取所有程序，并且只在HTML文档中显示名称、房间和时间。

我想这样做，以便所有6月13日星期一的活动都会显示，然后明天的网页将显示2011年6月14日星期二的活动等。

我把XML和HTML的一部分复制到了这篇文章中。

请帮忙。我不知道该怎么做。

这里是XML的一个小样本，因为我在列表中缩短了大约90个程序。

<ProgramList>
    <Program>
        <Name>English Conversation Group - Wed.  Morning</Name>
        <Building>Centereach</Building>
        <Room>Foundation Room</Room>
        <Date>6/14/2011</Date>
        <Time>9:30 AM-11:30 AM</Time>
    </Program>
    <Program>
        <Name>Family Center- One on One Counseling</Name>
        <Building>Selden</Building>
        <Room>Lower Meeting Room</Room>
        <Date>6/15/2011</Date>
        <Time>9:30 AM-4:00 PM</Time>
    </Program>
</ProgramList>

这是HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="nature2.js"></script> 
    <title>Untitled Document</title>
</head>
<body leftmargin="0" topmargin="0" marginheight="0" text="#444316">
    <script type="text/javascript">
function loadXMLDoc(dname)
{
    if (window.XMLHttpRequest)
    {
        xhttp=new XMLHttpRequest();
    }
    else
    {
        xhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhttp.open("GET",dname,false);
    xhttp.send("");
    return xhttp.responseXML;
}
xml=loadXMLDoc("ProgramList.xml");
path="/ProgramList/Program/*";
// code for IE
if (window.ActiveXObject)
{
    var nodes=xml.selectNodes(path);
    for (i=0;i<nodes.length;i++)
    {
    document.write(nodes[i].childNodes[0].nodeValue);
    document.write("<br />");
    }
}
// code for Mozilla, Firefox, Opera, etc.
else if (document.implementation && document.implementation.createDocument)
{
    var nodes=xml.evaluate(path, xml, null, XPathResult.ANY_TYPE, null);
    var result=nodes.iterateNext();
    while (result)
    {
        document.write(result.childNodes[0].nodeValue);
        document.write("<br />");
        result=nodes.iterateNext();
    }
}
    </script>
</body>
</html>

我去了网站查看示例，但我收到了未知的错误，示例没有加载。所以链接没有帮助

我想要3个html页面

第一个HTML页面将给我所有程序（名称）按日期分组。因此，只有今天的节目将显示这两座建筑

我希望显示以下结果：
<名称>
<时间>
<房间>
<建筑>

第二个Html页面将给我所有程序（名称），按日期和建筑1（中心每个）分组。因此，只有今天的程序才会显示1号楼。

第三个Html页面给我所有程序（名称）按日期和建筑2（Selden）分组。只有今天的程序才会显示用于构建2

我希望在第2页和第3页显示以下结果：

<名称>
<时间>
<房间>

我还希望页面能随着日期的变化而自动更新。

你还有其他建议吗？

通常只有在服务器上执行Xquery才有意义。但是，您仍然需要解析响应，以从结果中提取您想要显示的数据。

一句话：如果数据集很大，最好在服务器上进行过滤（查询），并使用Ajax只通过连线获取最小的数据集。

但是也可以从客户端使用Xquery：http://www.xqib.org/

看看它，让我知道这是否有帮助。

相关文章：