codecamp

W3.JS Includes

包含一个 HTML 文件

w3.includeHTML()

The HTML

保存 HTML 在你想包含的 HTML 文件中

content.html

<a href="https://www.w3cschool.cn/html/">HTML</a><br>
<a href="https://www.w3cschool.cn/css/">CSS</a><br>
<a href="https://www.w3cschool.cn/bootstrap/">Bootstrap</a><br>
<a href="https://www.w3cschool.cn/js/">JavaScript</a><br>
<a href="https://www.w3cschool.cn/sql/">SQL</a><br>
<a href="https://www.w3cschool.cn/php/">PHP</a><br>
<a href="https://www.w3cschool.cn/w3css/">W3.CSS</a><br>

Include the HTML

Including HTML 是通过使用 w3-include-html 属性:

<div w3-include-html="content.html"></div>

添加JavaScript

HTML 包括是由 JavaScript 完成的。

确保你的页面已经加载了 w3.js 并调用w3.includeHTML():

<script>w3.includeHTML();</script>

完整的示例

实例

<div w3-include-html="content.html"></div>
<script>w3.includeHTML();</script>

尝试一下 »   添加上CSS »

Include许多HTML片段

你可以包括任何数量的 HTML 片段:

实例

<div w3-include-HTML="h1.html"></div>
<div w3-include-HTML="content.html"></div>
<
script>
w3.includeHTML();</script>

尝试一下 »   添加上CSS »

添加回调函数

在 web 页面中包含 HTML 片段时,必须确保在正确包含 HTML 之前不会执行依赖于所包含 HTML 的其他函数。

“保留”代码的最简单方法是将其放在回调函数中。

可以在w3.includeHTML()中添加回调函数作为参数:

你将在本教程的下一章找到一个回调示例。





W3.JS 幻灯片
W3.JS Display
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }