在 HTML 文件中加载 .txt 内容？如果没有，那么在哪里？答案

【问题标题】：Loading .txt content in HTML file? If not, then where?在 HTML 文件中加载 .txt 内容？如果没有，那么在哪里？
【发布时间】：2020-09-26 20:45:47
【问题描述】：

对代码非常陌生。搜索了 2 天没有结果，我快疯了。

我有这个CSS designed bar，我在直播叠加层中使用它。我正在尝试将本地 .txt、xml 或 json 文件中的文本填充到栏上。我只是不知道如何调用这个文本然后设置它的样式。

为什么？我想最终编写一个可以读取/写入 .txt 文件的 python 脚本/GUI（如果它的 json 或 xml，我会尝试弄清楚）。婴儿步。

到目前为止，一切都是 div 框和一个被剪辑以创建黑条的视频（其循环显示为动画）。

使用

嵌入 src="txtfile.txt"

加载文件，但我无法设置它的样式 T_T。我非常感谢您的帮助！

主要问题。使用我在本地打开的这个文件 - 我如何（在后端）选择要读取的文本文件，然后设置该文本的样式？

我非常感谢您的帮助，甚至是朝着正确方向的推动。我很迷茫。

【问题讨论】：

您可以使用 ajax 检索文件内容，然后解析其内容以插入页面内的元素并设置这些元素的样式。很多关于如何将 ajax 与文本、json、xml 等一起使用的教程
您能否提供一些代码，以便我们清楚地了解您真正想要什么？
@AdnaneAr 老实说，还没有太多代码。我已经包含了唯一一个允许我从文件中提取文本的 sn-p - 但不允许我设置它的样式。它在最初的帖子中。
@charlietfl 我来看看 ajax。我对这件事很陌生，所以我正在寻找最简单的方法来实现它。整个内容作为浏览器源加载到 OBS 中。然后编码并发送到我的流。所有代码完全离线。

【解决方案1】：

您可能需要使用服务器语言。我建议您使用 PHP，因为您是代码新手。首先，您需要设置一个支持 PHP 的开发服务器进行开发。您可以自己搜索如何执行此操作，因为它超出了您的问题范围（WAMP/MAMP/XAMPP）。

如果您使用 PHP 作为服务器语言。假设 txtfile.txt 与您的 CSS 设计的栏位于同一目录中，您可以执行以下操作：

<?php

// specify txt file path
include 'txtfile.txt'; 

// store txt file contents as string
$my_string = file_get_contents('txtfile.txt');

?>

然后，无论您希望字符串出现在何处，只需回显变量即可。这是一个例子：

<span class="myCustomClass"><?php echo $my_string; ?></span>

然后，您可以在 CSS 中为您提供的任何类设置样式。

哦，记得把文件扩展名改成.php

或者，您可以将 txt 文件嵌入到 iframe 中，并将 iframe 放置在您想要的元素中：

<iframe src='txtfile.txt' scrolling='no' frameborder='0'></iframe>

...还有其他方法！考虑使用 jQuery 和 AJAX，因为它可能更容易做到没有使用 PHP 的麻烦。您可以通过 AJAX 调用加载文本文件，将其插入到文档中，然后您可以使用 CSS 设置内容的样式。

【讨论】：

非常感谢您抽出宝贵时间来写这篇文章。我会看看并试一试。澄清一下，如果一切都保持在本地，我是否必须设置一个支持 php 的开发服务器？
如果您打算使用 PHP，您需要在您的计算机上安装 PHP。或者，您可以将 txt 文件嵌入 iframe 并将 iframe 放置在您想要的任何元素中。我将用一个示例更新我的答案。
我很感激！你可能是对的，iframe 可以工作，我只是不明白 iframe 是如何工作的。如果我能给它一个类/ id，并为拉入的文本设置样式，我就完全满意了。我确实看到使用 AJAX，我可以在 JS 中使用 fetch() 并在不刷新页面的情况下更新文本。我正在研究如何做到这一点。