jQuery能做到的比iframe连接另一个网页html內容來的活用,使用css做样式变化,也较有弹性。再次比较sp include 和 php include 这样的方式无需使用以上asp和php服务器就能达到你想要的include html
下列程式变化更加入了导航(Menu list)做连接的切换,分別使用jquery include
三个html网页(a.html、 b.html、c.html)。
希望这样的方式能为您带來好的帮助。
<ul class="list-side">
<li><a target="a.html" >about</a></li>
<li><a target="b.html" >news</a></li>
<li><a target="c.html" >product</a></li>
<li><a href="http://ucmic.blogspot.com/" target="_blank" >contact</a></li>
</ul>
<div id="iframe">
<!--jquery 插入html 位址-->
</div>
$(document).ready(function(){
$.get("a.html",function(data){ //初始將a.html include div#iframe
$("#iframe").html(data);
});
$(function(){
$('.list-side li').click(function() {
// 找出 li 中的超链接 href(#id)
var $this = $(this),
_clickTab = $this.find('a').attr('target'); // 找到超链接a中的targer标签值
$.get(_clickTab,function(data){
$("#iframe").html(data);
});
})
})
});
分享到:
相关推荐
2.支持 html include 与 iframe 不同是不包含 <!doctype 。。。等一大堆没用的东西 3.将毫秒时间格式为你想要的格式 4.禁止空格输入 5.字符串转 bool 值 6.浏览器类型 7.以新标签页打开窗口(ie 不支持) 8.页面之间...
而Layer是一个基于jQuery的弹出层插件,它提供了更加丰富的弹框功能,比如对话框、提示框、加载层、iframe层等,并且提供了多种样式和参数,以适应不同的场景需求。 在实现自定义弹框时,首先要做的是将弹框的HTML...
// clean url (don't include hash vaue) url = (url.match(/^([^#]+)/)||[])[1]; } options = $.extend(true, { url: url, success: $.ajaxSettings.success, type: method || 'GET', iframeSrc: /^...
- **内联框架**: `<iframe>`标签用来嵌入另一个HTML文档,如`<iframe src="include.html" width="200" height="120"></iframe>`。 - **文本格式化标签**: - `<b>`和`<strong>`: 加粗文本。 - `<i>`和`<em>`: 斜体...
Iframe是HTML中用于嵌入文档的标记,可以用于实现一个网页中的网页,常常被用来加载外部资源而不干扰当前页面。本文将结合这三个技术点,通过实例讲解如何在PHP表单提交后关闭Layer弹窗中的iframe。 首先,介绍...
此外,`frameset`和`iframe`等HTML标签被用来加载具有独立功能的子页面,从而实现了早期的界面组件化。 同时,一些浏览器厂商开始尝试提供客户端组件技术。例如,Internet Explorer推出了HTML Component (HTC),...
这些部分通常在每个页面上都相同,因此可以将它们放在单独的HTML文件中,然后在需要的地方通过`<iframe>`,`<link rel="import">`(Web Components的一部分,但已被废弃),或者使用JavaScript库如jQuery的`.load()`...
在JavaScript中,我们经常需要加载外部资源,如脚本文件或IFRAME框架页,而这些操作往往是异步的,即它们不会阻塞主线程,直到加载完成。为了解决这种异步问题并确保在资源加载完毕后执行特定的操作,我们可以使用...
1.使用JQuery框架简化Ajax与JavaScript的开发量,实现JavaScript代码的有效开发与管理。 2.使用RSH框架实现Ajax系统中的客户端状态保存和模拟浏览器的后退前进功能。 在选择前端布局时,DIV布局方式是一种更加明智...
在JSP中,可以使用`<jsp:include>`或自定义标签库(Tag Library)来实现Ajax功能。JSP页面通常包含一个隐藏的iframe,用于接收Ajax响应。通过JavaScript控制iframe的src属性,发起Ajax请求,并处理响应。 ```jsp <!...
这些部分通常会被拆分成单独的HTML文件,然后通过服务器端的包含指令(如PHP的`include`)或者客户端的模板引擎(如AngularJS的`ng-include`)组合在一起。在这个场景下,问题在于如何在切换页面时只刷新主要内容...
缺点是不确定iframe是否支持延迟加载,若iframe加载了整个页面内容,那么它并不比include标签好,因为它仍然会导致页面加载缓慢,同时如果要实现单个元素的获取,可能需要对iframe的内容进行额外的查询操作。...
08 django模板之继承标签extend和添加标签include 第51章 01 数据库表与表之间的一对多多对多的关系 02 Django的ORM的概念 03 ORM对单表的增删改操作 04 ORM查询API 05 模糊查询之万能的双下换线 第52章 01 上节...
为了解决AJAXPOST函数和动态创建iframe时存在的兼容性问题,需要修改`include/js/common.js`中的相关函数。 - AJAXPOST函数的修改主要是为了解决在IE9中AJAXPOST可能无法正常触发的问题。以下是修改后的`ajaxpost`...