我看很多博客都用上了Ai摘要，但是作为一个日常零成本运营的选手，肯定是不想花一分钱的。而且我也不怎么想要给网站增加新的api请求（现在逐渐开始青睐静态方向的博客了）。作为一个爱折腾的人呢，我给自己搞了一个假的AI摘要，但是输出的效果也是直接全部输出的，缺少了那种ChatGPT的科技感。于是在原来的基础上新增了点代码。

之前的局部代码：

        $replacement = '<div class="ai-summary-container">
                          <div class="ai-summary-header">
                         <img src="xxx/jiqiren0202.svg"  style="float:left" alt="机器人LOGO" />   AI 摘要  <img src="xxxx/spark-logo-light.svg"  style="float: right" alt="讯飞星光LOGO" />
                          </div>
                          <div class="ai-summary-content">
                            $1
                          </div>
                          <div class="ai-summary-footer">
                            内容由讯飞星火GPT生成，经过人工审核后发布
                          </div>
                        </div>';

添加打字机效果后的代码：

        $replacement = '<div class="ai-summary-container">
                          <div class="ai-summary-header">
                         <img src="xxx/jiqiren0202.svg"  style="float:left" alt="机器人LOGO" />   AI 摘要  <img src="xxxx/spark-logo-light.svg"  style="float: right" alt="讯飞星光LOGO" />
                          </div>
                          <div class="ai-summary-content">
                            <div id="typing-content">$1</div>
                          </div>
                          <div class="ai-summary-footer">
                            内容由讯飞星火GPT生成，经过人工审核后发布
                          </div>
                        </div>
                        <script>
                          var content = document.getElementById("typing-content").textContent;
                          var currentChar = 0;
                          var displayContent = "";
        
                          function typeWriter() {
                            if (currentChar < content.length) {
                              displayContent += content.charAt(currentChar);
                              document.getElementById("typing-content").innerHTML = displayContent;
                              currentChar++;
                              setTimeout(typeWriter, 30); // 调整延时
                            }
                          }
        
                          typeWriter();
                        </script>';

Ai摘要显示的效果可以去看看文章《SpaceDesk评测：探索iPad成为电脑拓展屏的可能性与局限性》：