Home >Web Front-end >HTML Tutorial >html template, call page display based on link_html/css_WEB-ITnose
html template, call page display based on link_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:49:561213browse
When making website pages, I searched for various frames, but none of them were ideal. The frameset was difficult to control, and iframes were not very good at optimizing website SEO. It was always a headache.
Later I learned that it can be called directly using js. I used the page loading js call, as follows:
$("#head").load("head.html"); $("#foot").load("foot.html"); But there is a problem again. It is called on different pages. , how to write the address of the picture? Of course, there are solutions to this, such as node.js. I heard that it can be used, but I am not very familiar with it.
When you are bored, you can write it by yourself. You can keep the beginning and end still, and call the middle content at any time.
After testing, it can be implemented. The code is attached:
html:
<body> <ul id="list"> <li><a href="javascript:void(0)" val="1" target="_blank">11111</a></li> <li><a href="javascript:void(0)" val="2" target="_blank">22222</a></li> <li><a href="javascript:void(0)" val="3" target="_blank">33333</a></li> <li><a href="javascript:void(0)" val="4" target="_blank">444444</a></li> </ul> <div id="wrap"></div> </body>
js:
$(function(){ var load_href; $("#list li a").click(function(){ var val=$(this).attr("val"); console.log(val); switch(val){ case "1": load_href="111"; break; case "2": load_href="222"; break; } console.log(load_href); $("#wrap").load("page/" +load_href+ ".html") }) })
Record for later reference.
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn