jquery 实践操作:div 动态嵌套页面
此篇记录如何在指定 div 中嵌套一个页面
load() 方法:
1. 使用 $.load() 直接导入一个页面
$('#addPage_div').load("temp/handle.html", function () {
//其他操作,可对载入的 handle.html 中元素进行操作
});2. 加载页面片段
$("#result").load("ajax/test.html #container");3. 以 POST 形式发送 附加参数 并在成功时显示信息
$("#feeds").load("feeds.php", {limit: }, function(){
alert("The last 25 entries in the feed have been loaded");
});4.加载文章侧边栏导航部分至一个无序列表
HTML 代码:
<b>jQuery Links:</b>
<ul id="links"></ul>
jQuery 代码:
$("#links").load("/Main_Page #p-Getting-Started li");attr("src", "***.html")方法:
前提:必须在要嵌入的页面中设置 <iframe>
iframe:
ajax() 方法:
1. jQuery加载一个html页面到指定的div里.
假设 a.html 和b.html在同一目录(比如:加载a.html里面的<div id=“row"></div>这个div里面的所有内容加载到b.html的这个div里<div id="content"></div>)//b.html
<script >
$(document).ready(function() {
bodyContent = $.ajax({
url: "b.html",
global: false,
type: "POST",
data: ({
id: this.getAttribute('row')
}),
dataType: "html",
async: false,
success: function(msg) {
alert(msg);
}
})
});
</script>2. juqery $.ajax 请求另一个html页面的指定的“一部分”加载到本页面div,重点是一部分数据加载到本页面div
大至思路如下: $.ajax( {
url: url, //这里是静态页的地址
type: "GET", //静态页用get方法,否则服务器会抛出405错误
success: function(data){
var result = $(data).find("另一个html页面的指定的一部分");
$("本页面div").html(result); }
});或参考下面的代码:
$(function(){
$.ajax({
type:"POST",
url:"LoginLoadArticle.ashx",
data: "type="+escape("最新公告") ,
success:function(msg){
$(".gonggao").html(msg);
},
error:function(XMLHttpRequest, textStatus, thrownError){}
}) })
参考:http://www.jb51.net/article/88495.htm
jquery 实践操作:div 动态嵌套页面的更多相关文章
- jquery 实践操作:div 动态嵌套(追加) div
此片记录在指定 div 中动态添加 div html(): append(): 在被选元素的结尾(但仍在元素内部)插入指定的内容. 语法: $(selector).append(content); / ...
- jquery 实践操作:iframe 相关操作
此篇记录关于HTML 的 iframe 元素 的相关记录 定义:iframe 元素会创建包含另外一个文档的内联框架(即行内框架). 常用的基本 iframe 设置(详细设置属性参考API:http:/ ...
- jquery 实践操作:attr()方法
此篇要记录的是 关于 jquery 的 attr() 方法 在JS中设置节点的属性与属性值用到setAttribute(),获得节点的属性与属性值用到getAttribute(),而在jquery中 ...
- jquery 实践操作:load()方法
最近决定总结下实际项目中的 JS 相关的一些操作,因此开启此系列,记录使用过程中用到的一些实用操作问题和解决方法,给自己一份记录. jquery load方法是对jQuery.ajax()进行封装以方 ...
- 静态web页面与动态web页面的区别
一.静态web页面 在静态web程序中,客户端使用web浏览器经过网络连接到服务器上,使用HTTP协议发起一个请求(Request),告诉服务区我现在需要得到哪个页面,所有的请求交给web服务器,之后 ...
- jquery操作ajax返回的页面元素
这两天工作不忙,正好从朋友那里拿到一个某个应用的开发文档,相关数据放在了mongodb里,自己电脑可以本地开启服务器然后通过给的借口来获取数据.由于这是一个比较大比较全的一个完整项目,也没有那么多经历 ...
- jquery动态创建页面元素
jquery用$()方法动态创建一个页面元素,例如: var $div=$("<div title='动态创建页面元素'>欢迎创建一个新的div</div>" ...
- JQuery Mobile - 解决动态更新页面内容,CSS失效问题!
今天编写JQuery Mobile程序,需要对数组数据动态创建,并且每条数据对应一个复选框,于是我很顺利写了一个Demo,当我运行时候发现,和我期望的不一样!复选框确实创建出来了,但是却没有CSS效果 ...
- Jquery hover鼠标经过时弹出div动态提示语
一.效果图 二.需求描述 1.鼠标经过table每一行时,弹出div动态提示语: 2.div弹出层的位置随鼠标位置的变化而变化: 3.鼠标离开table或获取的动态提示语为空时,div弹出层消失. 下 ...
随机推荐
- el-upload控件一次接口请求上传多个文件
el-upload组件默认情况下上传多少个文件就会请求多少次上传接口,如何一次上传多个文件而不必多次请求上传接口呢?直接看代码 html <el-upload :action="act ...
- 十九、MySQL GROUP BY 语句
MySQL GROUP BY 语句 GROUP BY 语句根据一个或多个列对结果集进行分组. 在分组的列上我们可以使用 COUNT, SUM, AVG,等函数. GROUP BY 语法 SELECT ...
- mysql面试题:字段中@之前字符相同且大于等于2条的所有记录
公司发了一张面试题给我,题目如下: 在test数据库中有个flow_user表,找出email字段中@之前字符相同且大于等于2条的所有记录 答案: select substring_index(`em ...
- webpack的配置处理
1.webpack对脚本的处理 1.Js用什么loader加载? 1>webpack 本身就支持js的加载, 2>通过babel-loader ES2015 加载js,再用 babel-p ...
- PHP判断时关于null,0,true,flase的值
<?php// $wh = 0; //等于整数0,等于字符串'0',等于空字符串,等于空格字符串, 等于空(null),等于字符串('null')// $wh = '0'; //=>等于整 ...
- python3 题目 有四个数字:1、2、3、4,能组成多少个互不相同且无重复数字的三位数?各是多少?
方法一:for循环遍历 counter=0 for i in range(1,5): for j in range(1,5): for k in range(1,5): if i !=j and j ...
- 自动发现项目中的URL,django1版本和django2版本
一.django 1 版本 routers.py import re from collections import OrderedDict from django.conf import setti ...
- Codeforces Round #496 (Div. 3) ABCDE1
//B. Delete from the Left #include <iostream> #include <cstdio> #include <cstring> ...
- Android拨打电话不弹出系统拨号界面总结
我在网上搜了一下,解决这个问题,有两种方式: 1.反射调用系统底层方法,并获取系统权限 反射调用的代码如下: Class phoneFactoryClass = Class.forName(" ...
- F#周报2019年第25期
新闻 Azure Notebook概览 SpecFlow 3就在这里了! 使用新的Try .NET模版创建交互式文档 逐渐演化的.NET Core框架 Dylan与Linebreakers Oslo ...