这里有一个例子。网站是用html写的,标签是用javascript创建的。正如你从源代码中看到的,每个“tabcontent”类下的内容都有点长,因为所有的标签都要写在一个批量文件中。https://lwymarie.github.io/
我想知道是否有一种最简单的方法可以将标签内容放在名为tab1.html、tab2.html的单独文件中,然后在index.html主文件中包含或链接这些“模块”文件。
我注意到在stackoverflow中也有人问过类似的问题,链接如下,然而似乎讨论已经转向了不同的方向。HTML tabs with content in separate files
我在stackoverflow上找到了调用jquery或php的解决方案,但这些解决方案似乎没有直接解决javascript创建的标签的问题。
或者,如果更好的写作实践实际上不是“模块化”,而是有一个单一的html文件,请对此也发表评论。
1条答案
按热度按时间daolsyd01#
HTML导入不存在,因此您大致有三种选择:
1.将每个标签页移动到不同的文件。从导航中链接这些HTML文件。直接的缺点是(不需要做更多的工作)你可以在几个文件中复制粘贴任何对导航或全局结构的更改。
1.将所有内容移动到不同的文件中,但使用frame(或iframe)加载导航等内容。你必须巧妙地定位这些链接,否则它们只会影响frame内容(
target="_parent"
)。1.只保留一个HTML文件,然后从一些JS文件导入每个标签页的数据。当你试图有效地复制JSX时,这将很快变得非常棘手,JSX是一种在JavaScript中创建HTML模板的语言。
NextJS是一个现代的框架,它使得构建和部署这样的小网站变得非常容易。每个文件都是单独的页面,但是你可以在它们之间导入全局样式和布局。如果你有耐心看看这个check out the NextJS tutorial,它构建了非常类似的东西。