jQuery操作页面的元素
主要有添加,替换,删除,清空三种方式:
添加又分为,在之前添加,在之后添加,在元素外之前添加,在元素外之后添加。每个添加方式又有俩种方法(效果一模一样):
俩种方法区添加,在原内容之后:
p.appendTo("#div");
$("#div").append(p);
俩种方法区添加,在原内容之前:
p.prependTo("#div");
$("#div").prepend(p);
俩种方法区添加,在原内容外的前面添加:
p.insertBefore("#div");
$("#div").before(p);
俩种方法区添加,在原内容外的后面添加:
p.insertAfter("#div");
$("#div").after(p);
替换指定结点元素,也时俩种方式(下标是从1开始):
p.replaceAll("div p:nth-child(2)");
$("div p:nth-child(2)").replaceWith(p);
删除指定结点元素:
1.删除整个div:
$("div").remove();
2.删除指定元素,下标从1开始:
$("div p:nth-child(4)").remove();
清空内容 和删除也一样也时俩种方式(清空和删除的区别:清空只是将内容清空,框架还在,删除就是全部删除):
1.清空整个div:
$("div").empty();
2.清空指定元素:
$("div p:nth-child(2)").empty();
jQuery操作页面的元素的更多相关文章
- 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变
查看本章节 查看作业目录 需求说明: 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变 当用户单击"+" ...
- 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片
查看本章节 查看作业目录 需求说明: 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片 实现思路: 在 ...
- jQuery操作得到DOM元素
jQuery再DOM操作方面提供了一些函数及其用法,这里就对DOM元素的包装简单说明一下,怎样使用会了,对其它方法也能灵活的使用.以下是一个小样例及其效果图. 代码例如以下: <html xml ...
- jQuery 实战读书笔记之第五章:使用 jQuery 操作页面
html 如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> &l ...
- jQuery操作DOM基础 - 元素属性的查看与设置
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Jquery 操作页面中iframe自动跟随窗口大小变化,而页面不出现滚动条,只在iframe内部出滚动条
很多时候大家需要iframe自适应所加载的页面高度而不要iframe滚动条,但是这次我需要的是页面不需要滚动条而iframe要滚动条,且iframe自动跟随窗口大小变化.自适应页面大小.下面是代码,下 ...
- jquery操作ajax返回的页面元素
这两天工作不忙,正好从朋友那里拿到一个某个应用的开发文档,相关数据放在了mongodb里,自己电脑可以本地开启服务器然后通过给的借口来获取数据.由于这是一个比较大比较全的一个完整项目,也没有那么多经历 ...
- jquery操作iframe的方法:父页面和子页面相互操作的方法
今天在弄jquery操作iframe中元素:先由iframe中的子页面b.html给外面的父页面a.html页面传值,再将a.html页面计算机的值放到b.html页面上,这里就用到子页面和父页面相互 ...
- webAPI(DOM) 2.1 获取页面元素 | 事件1 | 属性操作 | 节点 | 创建元素 | 事件2
js分三个部分: ECMAScript标准:js的基本语法 DOM:Ducument Object Model--->文档对象模型--->操作页面的元素 BOM:Browser Objec ...
随机推荐
- python线程threading.Timer源码解读
threading.Timer的作用 官方给的定义是: """Call a function after a specified number of seconds: t ...
- 2019年10月13日 spss习题 wangqingchao
1.spss发行版本的说法,正确的是:B a.两年发行一个新版本 b.一年发行一个新版本 c.没有任何规律 d.三年发行一个新版本 2.哪些是spss统计分析软件的基本窗口:A a.结果查看 ...
- node.js 需要注意知识点
复习node.js 需要注意知识点--(重点) 2.1:参数传递获取造型 客户端脚手架(发) (参数传递) node.js(收) -发ajax this.axios.get(" ...
- 在 ASP.NET Core 项目中使用 MediatR 实现中介者模式
一.前言 最近有在看 DDD 的相关资料以及微软的 eShopOnContainers 这个项目中基于 DDD 的架构设计,在 Ordering 这个示例服务中,可以看到各层之间的代码调用与我们之前 ...
- Elasticsearch系列---简单入门实战
概要 本篇主要介绍一下Elasticsearch Document的数据格式,在Java应用程序.关系型数据库建模的对比,介绍在Kibana平台编写Restful API完成基本的集群状态查询,Doc ...
- 详解Redis RDB持久化、AOF持久化
1.持久化 1.1 持久化简介 持久化(Persistence),持久化是将程序数据在持久状态和瞬时状态间转换的机制,即把数据(如内存中的对象)保存到可永久保存的存储设备中(如磁盘). 1.2 red ...
- Nginx 匹配流程一览
在 nginx server 模块中,location 的定义长被用来匹配一个标准的 URI, 并根据 URI 的不同做出相应的服务方案. nginx location 匹配的优先级 在 locati ...
- 无法优化的O(n!) 算法
旅行商问题: 有一位旅行商,他需要前往5个城市. 要前往这5个城市,同时要确保旅程最短. 对于每种顺序,他都计算总旅程,再挑选出旅程最短的路线.5个城市有120种不同的排列方式.因此,在涉及5个城市时 ...
- 减少HTTP请求的方式
1. 图片地图 缺点:坐标难定义:除了矩形之外几乎无法定义其他形状:通过DHTML(动态DOM操作)创建的图片地图在 IE 不兼容 <img usemap="#map1" b ...
- GentOS 7 安装步骤
附上原作者的博客网址: https://blog.csdn.net/qq_42570879/article/details/82853708 1.CentOS下载CentOS是免费版,推荐在官网上直接 ...