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 ...
随机推荐
- 简单搭建syslog-ng server记录log
### 简单搭建syslog-ng server记录log 安装syslog-ng apt-get install syslog-ng 安装syslog-ng 配置syslog-ng vim /etc ...
- Junit使用方法
Junit使用方法 步骤: 定义 一个测试类(测试用例) 建议 测试类名:被测试类名+Test 包名:xxx.xxx.xxx.test 测试方法 建议: 方法名:test测试的方法名 返回值: voi ...
- nginx+uWSGI+django+virtualenv+superviso发布web服务器
1.环境依赖 yum groupinstall "Development tools" -y yum install zlib-devel bzip2-devel pcre-dev ...
- python获取随机验证码或者下发激活码
http://stackoverflow.com/questions/2823316/generate-a-random-letter-in-python >>> import ra ...
- Openlayers Overlay使用心得
Overlay在Openlayers里是浮动层的概念,区别于vector这样的图层,通常用于弹窗.撒点.以及解决加载icon样式不支持的gif等格式图片. 此次用overlay的过程中遇到很多问题,在 ...
- SpringBoot 项目脚手架
写在前面 之前也一直很少有写SpringBoot项目相关的文章,今天 准备整理一个我自己初始化SpringBoot项目时的一个脚手架,便于自己后面查阅.因为SpringBoot的约定大于配置,在整合各 ...
- PowerMock学习(七)之Mock Constructor的使用
前言 我们在编码的时候,总习惯在构造器中传参数,那么在powermock中是怎么模拟带参数构造的呢,这并不难. 模拟场景 我们先模拟这样一个场景,通过dao中的传入一个是布尔类型(是否加载)和一个枚举 ...
- (四十六)golang--网络编程(简易的聊天系统)
Go主要的目标之一就是面向大规模后端服务程序,网络通信这块是服务端程序必不可少也是至关键的一部分. 网络编程有两种: (1)TCP Socket编程:是网络编程的主流,之所以叫TCP Socket编程 ...
- C语言基础 -- 变量
常用变量类型 地址 小端 低地址保存低位,高地址保存高位 常用于 PC(复杂指令集) 大端 低地址保存高位,高地址保存低位 常用于 ARM/手机/网络(精简指令集)
- YoungLots Team - Record a software installation
一.写在最前 本文记录安装或配置以下软件或环境的过程:VScode,Xampp,navicat,PHP,html,CSS,SQL,JavaScript. 作者使用的环境:浏览器:Google Chro ...