🌻 记录自己写的一言

要实现这个功能,需要完成以下几个步骤:

创建hitokoto.txt文件,并在其中添加你想要显示的句子。
编写hitokoto.php脚本,用于随机读取hitokoto.txt中的一句话。
在index.html中调用hitokoto.php,并使用JavaScript实现每隔五秒更新一次内容。
以下是具体的实现方法:

步骤1:创建 hitokoto.txt

在你的服务器上创建一个名为hitokoto.txt的文件,内容如下(每行一个句子):
例如:

人生苦短,赶快独霸时间线。
山重水复疑无路,柳暗花明又一村。
...

步骤2:编写 hitokoto.php

<?php
// 设置文件编码为UTF-8
header('Content-Type: text/html; charset=utf-8');

// 读取hitokoto.txt文件内容
$hitokoto_lines = file('hitokoto.txt', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);

// 随机获取一句
$random_line =$hitokoto_lines[array_rand($hitokoto_lines)];

// 输出结果
echo $random_line;
?>

步骤3:编写index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>一言页面</title>
    <script>
        function updateHitokoto() {
            // 使用jQuery的ajax方法获取hitokoto.php的内容
            $.ajax({
                url: 'hitokoto.php', // hitokoto.php的路径
                success: function(data) {
                    // 将获取到的内容设置到id为hitokoto_text的元素上
                    $('#hitokoto_text').text(data);
                }
            });
        }

        // 页面加载完成后执行
        $(document).ready(function() {
            // 初始更新一言
            updateHitokoto();
            // 设置定时器,每隔五秒更新一次
            setInterval(updateHitokoto, 5000);
        });
    </script>
</head>
<body>
    <div id="hitokoto_text"></div>
    <!-- 引入jQuery库 -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</body>
</html>

这样,你的 index.html 页面就会从 hitokoto.php 获取一句随机句子,并显示在页面上。确保你的服务器支持 PHP 和 UTF-8 编码,并且 hitokoto.txt 文件位于 hitokoto.php 可以访问的路径下。