做网站要引入很多外部链接,如果点击导航栏每个页面都刷新会浪费资源和时间,所以这就是jq的意义所在。下面就是在本页面刷新新的页面而不跳转。
1.index.html
导航栏
<li class="nav-item " >
<a href="#">简介</a>
</li>
<div id="container">你好</div>
2.index.html内联JS
下面展示一些
内联代码片`
$(document).ready(function(){
$(".nav-item").click(function(){
$("#container").load("****.html #container")
});
});
load语句意思就是从****.html里面的div id=“container”插入到index.html里面的div id=“container”
3.****.html
不需要插入html原有的标签html、head、body这类,只编辑你想写的代码要实现即可
别忘了要在index.html里body尾部引入公共js:
4.最后在特定的服务器环境下运行即可(我就是在Wampserver配置后运行的 或者用edge浏览器运行也可以)