Ajax获取网页添加到div中
1:利用DOM获取该 div 的 ID,然后清空该DIV的内容(如果你需要接着里面的内容添加可不要清空);需要注意点是清空最好用“ empty() ”;
2: 把 async设成true ,否则又一条警告的错误,这条错误导致你的内容显示不出来;下面就是警告的错误

3:就是添加HTML了。
具体代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试</title>
</head>
<body>
<div id="tset">
<a href="http://www.baidu.com">百度</a>
</div>
<button id="btn">测试</button>
</body>
<script src="../../Js/jquery-3.4.1.js"> </script><script src="../../Js/layer-v3.1.1/layer/layer.js"></script>
<script>
$(function(){
$("#btn").click(function(){
$.ajax({
url:'../../Html/JQueryDome/弹框.html',
dataType:'html',
type:'get',
async:true,
success:function(data){
console.log(data);
$("#tset").html(data)
},error:function(){ }
})
})
})
</script>
</html>
最后总结一下清空DIv的内容的方法
empty() 情况选择器里面的内容
语法 $(“选择器”).empty()
remove() 删除后再恢复事件不在
语法 $(“选择器”).remove()
detach() 删除后再恢复事件在
语法 $(“选择器”).detach()
顺便把其余的也给出来吧:
包裹
wrap() 每一个外面都添加一个新的元素
语法 $(“选择器”).wrap(“<元素名称>”)
wrapAll() 同一包裹一个元素
语法 $(“选择器”).wrap(“<元素名称>”)
wrapInner() 在里面添加一个新的元素
语法 $(“选择器”).wrap(“<元素名称>”)
unwrap() 去掉包裹
语法 $(“选择器”).wrap(“<元素名称>”)
外部插入
after() 在后面插 语法: $(“选择器”).after(“<元素名称>”)
insertAfter() 在后面插 语法: $(“选择器”).insertAfter(“<元素名称>”)
before 在后面插 语法: $(“选择器”).before(“<元素名称>”)
insertBefore() 在后面插 语法: $(“选择器”).insertBefore(“<元素名称>”)
内部插入(在)
append() 在后面插 语法: $(“选择器”).append(“<元素名称>”)
appendTo() 在后面插 语法: $(“<元素名称>”).appendTo(“选择器”)
prepend() 在前面插 语法: $(“选择器”).prepend(“<元素名称>”)
prependTo() 在前面插 语法: $(“<元素名称>”).prependTo(“选择器”)
替换
replaceWith() 语法 $(“选择器”).replaceWith($(“选择器”))
replaceAll 语法 $(“<元素名称>”).replaceAll (““选择器”
克隆
clone()
语法:1、$(“选择器”).clone().append(“元素名”)
2、$(“选择器”).append($(“元素名”).clone())
对了,还有一点就是(当然我是MVC中遇到的,不确定都有哟),就是在获取的网页中有内部JS,比如<script>这里是一个获取本地的时间函数</script>,然后当你执行AJAX时,页面不会添加到DIV中,整个页面就是是当前时间(但是地址没有变化)。解决办法:可以把该JS删除,或者该JS换成一个外部JS即可。
Ajax获取网页添加到div中的更多相关文章
- 使用jQuery动态克隆表格,并且添加至div中(使用前需要引入jQuery)
<!DOCTYPE html> <html> <head> <title></title> <meta charset="u ...
- jQuery ajax 获取信息展示在“下拉列表”中
<link href="${ctxStatic}/jquery-select2/4.0.3/select2.min.css" rel="stylesheet&quo ...
- python获取网页编码问题(encoding和apparent_encoding)
在requests获取网页的编码格式时,有两种方式,而结果也不同,通常用apparent_encoding更合适 注:推荐一个大佬写的关于获取网页编码格式以及requests中text()和conte ...
- div中显示某个网页
原文:div中显示某个网页 1.<iframe>方法 2.ajax方法 ajax+流实现无框架限制块刷新: 主框架index页面: js: $(function(){ $("#d ...
- jQuery中使用Ajax获取JSON格式数据示例代码
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式.JSONM文件中包含了关于“名称”和“值”的信息.有时候我们需要读取JSON格式的数据文件,在jQuery中 ...
- WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据
WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据 WebForm1.aspx 页面 (原生AJAX请求,写法一) <%@ Page Langu ...
- 通过Jquery中Ajax获取json文件数据
1. JSON(JavaScript Object Notation): javaScript对象表示法: 是存储和交换文本信息的语法,比xml更小,更快,更易解析. 2. JSON基本书写格式 : ...
- 利用html5中的localStorage获取网页被访问的次数
利用html5中的localStorage获取网页被访问的次数 <!DOCTYPE html> <html> <head> <meta charset=&qu ...
- WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据(转)
WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据 WebForm1.aspx 页面 (原生AJAX请求,写法一) <%@ Page Langu ...
随机推荐
- 一文彻底搞懂CAS实现原理 & 深入到CPU指令
本文导读: 前言 如何保障线程安全 CAS原理剖析 CPU如何保证原子操作 解密CAS底层指令 小结 朋友,文章优先发布公众号,如果你愿意,可否扫文末二维码关注下? 前言 日常编码过程中,基本不会直接 ...
- 侠梦说pinpoint--左侧服务地图调用量和WasOn过滤
前言 这篇文章主要是从pinpoint-web界面入手,我们的目标是弄清楚两个问题: 1. pinpoint左侧服务地图上的调用量数据是怎么查询的? 2.界面查询条件WasOnly是什么意思? 左侧服 ...
- 构建一个flink程序,从kafka读取然后写入MYSQL
最近flink已经变得比较流行了,所以大家要了解flink并且使用flink.现在最流行的实时计算应该就是flink了,它具有了流计算和批处理功能.它可以处理有界数据和无界数据,也就是可以处理永远生产 ...
- IJKPlayer如何支持https
给ijkplayer安装支持https 首先使用如下终端命令安装yasm 第一: 1. curl http://www.tortall.NET/projects/yasm/releases/yasm- ...
- iOS开发-Apple Pay-苹果支付
转自:http://www.open-open.com/lib/view/open1471952847228.html Apple Pay,是苹果公司在2014年苹果秋季新品发布会上发布的一种基于NF ...
- 使用dva改造旧项目的数据流方案
前言 最近在给自己的脚手架项目转到TypeScript时,遇到了一些麻烦. 项目之前采用的是react + react-redux + redux-thunk + redux-actions +re ...
- 导出excel时,跳转新空白页,不要跳转怎么改
导出excel的时候,偶尔会出现跳转到一个新页面再导出excel js中用window.open()做跳转 不想让它跳转到新页面,需要加一个隐藏的iframe <iframe name=&quo ...
- Ceph分布式存储-总
Ceph分布式存储-总 目录: Ceph基本组成及原理 Ceph之块存储 Ceph之文件存储 Ceph之对象存储 Ceph之实际应用 Ceph之总结 一.Ceph基本组成及原理 1.块存储.文件存储. ...
- ARTS-S linux查看进程打开的文件数
当怀疑进程打开文件没有关闭时,可以反复执行以下命令,查看进程打开的文件数是否会不断增加. ls -l /proc/18707/fd | wc -l 其中18707是进程id
- 2- 设置断点修改Request
以下是借鉴别人的知识分享.我在这里转载,如有冒犯,还请告知. 如何设置断点修改Request呢? fiddler最强大的功能就是可以设置断点了.设置好之后,你可以修改HttpRequest的任何信息, ...