jQuery怎么加载一个html页面到我指定的div里面
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery怎么加载一个html页面到我指定的div里面相关的知识，希望对你有一定的参考价值。
使用ajax的load方法。
语法：
load(url,data,function(response,status,xhr))
具体代码：
扩展资料：
.load() 方法，与 $.get() 不同，允许我们规定要插入的远程文档的某个部分。这一点是通过 url 参数的特殊语法实现的。如果该字符串中包含一个或多个空格，紧接第一个空格的字符串则是决定所加载内容的 jQuery 选择器。
jQuery 使用浏览器的 .innerhtml 属性来解析被取回的文档，并把它插入当前文档。在此过程中，浏览器常会从文档中过滤掉元素，比如 <html>, <title> 或 <head> 元素。结果是，由 .load() 取回的元素可能与由浏览器直接取回的文档不完全相同。
注释：由于浏览器安全方面的限制，大多数 "Ajax" 请求遵守同源策略；请求无法从不同的域、子域或协议成功地取回数据。
参考资料：Jquery官方中文文档api--ajax load()
参考技术A一、jQuery加载一个html页面到指定的div里
把a.html里面的某一部份的内容加载到b.html的一个div里。
比如：加载a.html里面的<div id=“row"></div>这个div里面的所有内容加载到b.html的这个div里<div id="content"></div>
用jquery ajax 可以实现
假设 a.html 和b.html在同一目录
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>
二、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)
)
)本回答被提问者采纳 参考技术B $("#ID")或者$(".class")
jQuery进度条加载直到页面重定向
【中文标题】jQuery进度条加载直到页面重定向【英文标题】：jQuery progress bar load until page redirects 【发布时间】：2015-10-05 04:32:34 【问题描述】：我有一个包含一些附属链接的网站，当点击链接时，用户会被带到我网站上的一个临时页面，这个页面上有一个隐藏的附属链接，在 1 秒后使用 jQuery 单击该链接。
我想显示 jQuery 加载栏进度，直到页面重定向到附属链接。我该怎么做？
【问题讨论】：
你有没有写代码让我们看看？我们喜欢代码 【参考方案1】：是的，你可以试试类似的，
// for 10 intevals only and after that your affiliate link is clicked.
var i = 0,
parts=20,
interval=1000/parts;// for 1 second, I used 1000, you can change accordingly
var c = setInterval(function()
if (i++ > parts-1)
clearInterval(c);
alert('link clicked now');
p=Math.floor($('.progress').width()/parts);
$('.progress-bar').width(p+$('.progress-bar').width());
, interval);.progress
width: 100%;
border: 1px solid #999;
height: 20px;
border-radius: 3px;
.progress-bar
width: 0;
background-color: green;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="progress">
<div class="progress-bar"> </div>
</div>你也可以试试https://css-tricks.com/css3-progress-bars/和https://css-tricks.com/html5-progress-element/
【讨论】：
感谢这是有效的，但只加载了大约 20% 的栏，然后重定向 - 可能是我的错误在某处 警报显示，栏在 10 - 20% 处停止，然后重定向 我更改了零件 = 5，效果更好，负载 60-70% parts用于将整体进度划分为子进度，使用1只会一次性加载进度，所以使用20更好查看。您也可以将其更改为 5 或 10，并且在我结束时效果很好以上是关于jQuery怎么加载一个html页面到我指定的div里面的主要内容，如果未能解决你的问题，请参考以下文章