【问题标题】:Another way to display content from external file in html另一种在 html 中显示来自外部文件的内容的方法
【发布时间】:2021-09-14 11:09:50
【问题描述】:

我有一个带有 UL 元素的 html 文件。 我想从与 html 文件位于同一文件夹中的外部文件中加载此 UL 的 LI 元素。 外部文件可以是任何类型的文件。所以 .html 或 .txt,xml 可能吗? (最好不要JS)

我已经尝试过的方法,但为什么我不想使用它们:

jQuery 加载当然可以,但我不想为相对简单的请求使用外部库。

XMLhttprequest这将是一个本地的非常简单的工具,对于同事来说,这对于仅仅10 li 的请求来说似乎也太大了。

w3 包含与 XMLHTTPrequest 相同

document.write 我现在使用 document.write 作为解决方案,但外部文件是 .js 文件。我宁愿让我的同事在 HTML 或 txt 文件中工作,而且我阅读了很多关于 document.write 的负面内容。这个文件以: document.write(' - 我宁愿让文件以 li 开头,例如 1 li >

iframe 或对象我不喜欢这些标签如何将全新的 html 和 body 标签附加到 UL,而且样式也是一个问题。

php 对于本地 Web 应用程序来说也是一大步。

文件阅读器还尝试让用户在文件阅读器中上传 txt 文件。但我不想要上传选项

我可能尝试了比上述解决方案更多的方法。但我无法理解,如果文件在同一个文件夹中,这将无法更轻松或更轻量级地完成。

如果可能的话,寻找一个简单/容易的解决方案。

【问题讨论】:

  • "如果文件在同一个文件夹中。" webapps 并不关心文件在在磁盘上的位置。任何请求都是针对可能存在或可能不存在于同一台机器上的资源。在 HTTP 上下文中,它不是“在同一个文件夹中”。因此,这并不容易。
  • fetch本地文件,然后用element.innerHTML设置你的UL元素的HTML

标签: javascript html file load external


【解决方案1】:

HTML 导入的原生实现将从 Chrome 73 中移除,因此现在建议使用原生 fetch() 或第三方库。

已弃用https://www.w3.org/TR/html-imports/

<link rel="import" href="myfile.html">

【讨论】:

  • 感谢您的回答。我以为这已被弃用?也试过这个,但没有用,发现它已被弃用
  • 编辑评论抱歉 - 到目前为止不要使用此功能:D
猜你喜欢
  • 2021-10-17
  • 2021-12-03
  • 2014-08-18
  • 2015-02-15
  • 1970-01-01
  • 2012-03-15
  • 2013-03-27
  • 2015-03-20
  • 2021-12-03
相关资源
最近更新 更多