如何更新下拉菜单上每天都在变化的 url 引用？答案

【问题标题】：How to update url references that change every day on the drop down menu?如何更新下拉菜单上每天都在变化的 url 引用？
【发布时间】：2017-04-05 15:57:46
【问题描述】：

每天，您下载一个包含 url 的 txt 文件，然后我必须手动更新下拉菜单的 index.html 文件。有没有办法自动更新 url 而无需编辑索引文件？这是一个示例，说明如何拨打每天消耗的 file.txt 以及索引文件代码的一部分。

Text1、Text2 和 Text3 保持不变，而 url 每天都在变化

File_url.txt

<a href='http://example.com/update1/day1.txt'>text1</a><br/>
<a href='http://example.com/update2/day1.txt'>text2</a><br/> 
<a href='http://example.com/update3/day1.txt'>text3</a><br/>

在索引文件中，url是这样插入的

文件 index.html

    <!DOCTYPE html PUBLIC>



<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<title>CSS DropDown Menu</title>

<link rel="stylesheet" type="text/css" href="css/reset.css" media="screen" />

<link rel="stylesheet" type="text/css" href="css/simple.css" media="screen" />

</head>

<body>



<div id="drop-menu">

<ul id="menu">

  <li><a href="http://example.com/home.php"target="principale" >Home</a></li>

<ul>

</ul>

 </li>

 <li><a href="#"target="principale" >Extra</a>

<ul>
<li><a href='http://example.com/update1/day1.txt'target="principale">text1</a><br/></li>
<li><a href='http://example.com/update2/day1.txt'target="principale">text2</a><br/></li>
<li><a href='http://example.com/update3/day1.txt'target="principale">text3</a><br/></li>

</ul>

 </li>

 <li><a href="#">About</a></li>

 <li><a href="#">Contact</a></li>

</ul>

</div>

<iframe name="principale" src="http://example.com/home.php" marginheight="50" height="800" width="100%" allowfullscreen = "true" ></iframe>

</body>

</html>

比如第二天就能找到

File_url.txt

<a href='http://example.com/update1/day2.txt'>text1</a><br/>
<a href='http://example.com/update2/day2.txt'>text2</a><br/> 
<a href='http://example.com/update3/day2.txt'>text3</a><br/>

有没有办法自动更新引用 Url，可能使用永远不会改变的 Text1、Text2 和 Text3？

【问题讨论】：

写index.html的代码在哪里？为什么不将其粘贴在 index.php 中并使其成为索引文件（而不是静态 index.html）。直接读取 File_url.txt 并动态生成您的下拉列表。
我编辑了帖子，现在index.html / index.php文件已经完成
您能否删除标签 php，因为此问题不再与 php 相关，所选答案也不反映 php。谢谢你

标签： php html

【解决方案1】：

有几种方法可以解决这个问题，一种是遍历 index.html(index.php?) 中的 file_url.txt 您可以在How to read a file line by line in php

中遵循此示例

请记住，“file_url.txt”是文件所在的路径。很有可能你的结构是这样的。

根目录
- index.php
- file_url.txt

你会想要“./file_url.txt”

    ...  
    <li><a href="#"target="principale" >Extra</a>

      <ul>
          <?php if ($file = fopen("./file_url.txt", "r")) {
            while(!feof($file)) {
              $line = fgets($file);
              # do same stuff with the $line
                echo sprintf(
                  '<li>%s</li>',
                  $line
                );
            }
            fclose($file);
          } ?> 
     </ul>
 </li>

 <li><a href="#">About</a></li>
 ...

否则，我相信 javascript ( jQuery ) 将是必经之路。

【讨论】：

我应该如何编辑 index.html 文件你可以举个例子，我目前在 localhost 下运行所有东西，对编程非常陌生，cmq 谢谢你的回答
添加了一些基本结构供您使用。如您所见，大多数人都建议使用客户端脚本。不确定这是您想要的方式，因为在某些情况下您会失去 SEO，或者如果 javcascript 已关闭

【解决方案2】：

例如，如果您使用像 PHP 这样的服务器端脚本，您可以使用像 readfile() 这样的函数来读取整个文件，然后使用 foreach 函数来迭代它的行并将项目呈现到您的 html。

但是，如果您不立即使用服务器端脚本，我认为您可以公开 txt 文件，以便可以通过 URL 访问它，例如 localhost/file_url.txt 然后使用 javascript ajax 函数从 URL 获取它的内容和将它们呈现到您的 HTML 中。

这是使用 javascript 获取文件内容的代码：

<!DOCTYPE html PUBLIC>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>CSS DropDown Menu</title>
    <link rel="stylesheet" type="text/css" href="css/reset.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="css/simple.css" media="screen" />
</head>
<body>
    <div id="drop-menu">
        <ul id="menu">
          <li><a href="http://example.com/home.php"target="principale" >Home</a></li>
          <li><a href="#"target="principale" >Extra</a></li>
        <ul>
        <ul id="dynamic-menu">

        </ul>
    </div>
    <iframe name="principale" src="http://example.com/home.php" marginheight="50" height="800" width="100%" allowfullscreen = "true" ></iframe>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
        $(document).ready(function() {
            var menuRequest = $.ajax({
                url: 'http://localhost:30001/file_url.txt'
            });

            menuRequest.done(function(data, status, xhr) {
                var dynamicMenuWrapper = $('#dynamic-menu');
                dynamicMenuWrapper.html(data);
            });
        });

    </script>
</body>
</html>

*注意：记得通过将您的 txt 文件指向特定的 URL 来访问它

【讨论】：

感谢您的帮助，我尝试了您的编辑，但似乎不起作用，实际上在附加菜单下，我找不到任何链接。
您是否已将 id="dynamic-menu" 放置到要放置动态菜单的元素中？这里是脚本的逻辑： 1. 将 id 放置到要放置动态菜单的 html 元素中，在我的示例中，我将其放置在 <ul id="dynamic-menu"> 中，2. 使用文件中的 ajax 请求获取菜单列表，3 . 使用 javascript 操作 html，方法是将您进入的菜单列表附加到具有 id="dynamic-menu" 的 html 元素中。
抱歉，您如何运行您的 html 脚本？通过使用 XAMPP 等 Web 服务器还是直接从文件目录中打开它？
手动编辑 File_url.txt 我知道它会起作用，但我必须通过编辑文件来更改它。 <li><a href="http://example.com/home.php"target="principale" >Home</a></li> <li><a href=""principale" >Extra</a> <ul> <li><a href='http://example.com/update1/day1.txt'>text1</a><br/></li> </li><a href='http://example.com/update2/day1.txt'>text2</a><br/></li> </li><a href='http://example.com/update3/day1.txt'>text3</a><br/></li>我在附加菜单下找到了链接并且它有效，我如何在从文件中读取每个字符串之前直接添加更改
您的问题解决了吗？抱歉暂时没有回复嘿嘿