》》Jqurey html
第1部分:jQuery HTML
1.获取内容和属性
-- 获取内容:
text():设置或获取所选元素的文本内容
html():设置或获取所选元素的内容(包括HTML标记)
val():设置或获取表单字段的值
-- 获取属性:
attr():设置或获取属性值
ps1:以上函数不传入参数时是获取;传入参数时是设置。
ps2:以上函数均有最后一个参数设置为回调函数。回调函数有两个值:当前选中元素下标,旧值。
2.添加元素
· append():在被选元素的末尾插入内容
· preappend():在被选元素的开头插入内容
· after():在被选元素之后插入内容
· before():在被选元素之前插入内容
ps:append/preappend:选择元素内部嵌入;before/after:选择元素外部追加。
未追加前效果:
追加后效果:
插入后:hello tomorrow是使用append():插入到div里面了,并与div里面的元素内容相联合;而hello yesterday是使用after():插入待div外面,即div元素的后面。
3.jQuery 删除元素:
remove():删除被选元素及子元素。ps:remove()可接受一个参数,对被删元素进行过滤。参数是jQuery选择器的语法。例如:$('p').remove('.test1');
empty():从被选元素中删除子元素(被选元素没有被删除,相当于留了一个外壳)
4.获取/设置css类:
addClass():向被选元素中添加一个或多个类;
removeClass():向被选元素中删除一个或多个类;
toggleClass():切换addClass()和removeClass();
css():设置或获取css属性。(有参数设置值;无参数获取值);css有参数:css("propertyname":"value"),建议属性名和属性值都加上引号;如果属性名不加引号,要使用驼峰标记法:如margin-left变为marginLeft。
5.jQuery尺寸
· width()/height():设置或获取当前元素的宽度/高度(不包括内边距,边框,外边距)
· innerWidth()/innerHeight():设置或获取当前元素的宽度/高度(包括内边距)
· outerWidth()/outerHeight():设置或获取宽度/高度(包括内边距和边框);
第2部分:jQuery遍历
因为DOM其实就是树状结构,因此相关算法中树的概念可以很容易的引申过来。
1.遍历--祖先(父元素以上都是祖先元素):
· parent():返回被选元素的直接父元素
· parents():返回被选元素的所有祖先元素,它会一直遍历到文档根元素(<html>)
· parentsUntil():返回介于两个指定元素间的所有祖先元素。如:$('span').parentsUntil('div'):代表span与div之间所有的祖先元素。
2.遍历--后代(子元素一下都是后代元素):
· children():返回被选元素的直接子元素
· find():返回被选元素的所有子元素(一直遍历到最后一个子元素)
3.遍历--同胞(siblings;兄弟元素,具有相同的父元素)
· siblings():返回被选元素的所有同胞(兄弟)元素;可选参数可以用来进行过滤:$('h2').siblings('p'):返回与h2具有相同父元素的p元素
· next():返回被选元素的下一个同胞元素(只返回一个元素)
· nextAll():返回被选元素后面的同胞元素
· nextUntil():介于两个参数之间的同胞元素
· prev();prevAll();prevUntil():与上述类似,只不过遍历方向是向上走。
4.遍历--过滤
· first():返回被选元素的第一个元素
· last():返回被选元素的最后一个元素
· eq():返回被选元素中带有指定索引号的元素;索引号从0开始;如:$('p').eq(1):返回第二个<p>元素
· filter():如:$('p').filter('.test'):返回带有class="test"的<p>元素
· not():返回不符合标准的所有元素,与filter()执行结果相反。
第3部分:jQuery AJAX
了解AJAX:Ajax之路
其实jQuery Ajax就是将ajax实现代码封装,同时兼顾了不同浏览器的Ajax实现。
1.jQuery load():从服务器加载数据,并将返回的数据放入被选元素中。
· url:必须,希望加载的URL;ps:可以将url选择器添加到url中;
· data:可选参数,与请求一起发送的字符串键值对集合;
· callback:可选,load()完成后执行的回调函数;可设置的参数:
responseTxt:包含调用成功的结果内容;
statusTxt:包含调用的状态;"success"或"error"
xhr:XMLHttpResponse对象
2.get()与post()方法
$.get():
url:必选;callback:可选;callback第一个参数存放请求页面的内容,第二个参数存放请求的状态。
如:
$.post():
url:必须;其它可选参数。
第4部分:jQuery noConflict()
jQuery使用作为简写。所以存在一个问题:如果其它js框架使用了作为jQuery的简写。所以存在一个问题:如果其它js框架使用了符号,或者书写的js代码中定义了$作为变量或者函数名,这时候就会产生冲突。
释放$,使用jQuery替代:
$.noConflict()返回的引用,可以存入变量。
》》Jqurey html的更多相关文章
- 《《我是一只IT小小鸟》》读后感
接触IT也已经半年了,在这半年我没有充足的时间去了解IT这个行业,在大学生职业规划课程上,老师推荐了<<我是一只IT小小鸟>>这本书,我才发现IT这个行业并不是想象的那么无趣, ...
- 【图文详细教程】maven3安装配置+eclipse离线安装maven3插件《《唯一成功的教程~~~2018-01-09》》
环境搭建前提: 1.电脑上已经安装了1.7以及以上版本的JDK(因为我提供的maven版本是最新的3.3.9的,要求最低JDK1.7) 2.配置好了ecplise并且能正常启动 第一步:下载maven ...
- jsp---》》》新闻发布系统的项目跟踪+++++++文件上传
先来一个分层架构图: WeebRoot目录下的页面: 现在,此项目以实现登录,注销,新闻列表,编辑主题>>>> 先来登录部分的关键代码 index.jsp中的代码 userIn ...
- 读《《图解TCP-IP》》有感
读<<图解TCP/IP>>有感 TCP/IP 近期几天读完<<图解TCP/IP>>,收获蛮多,记得上学时读stevens的<<TCP/IP具 ...
- heavy dark--读《《暗时间》》
本书名为<<暗时间>>,个人觉得是一个非常好的名字:1.迷茫的大学生有多少的业余时间,但又浪费多少的业余时间,浪费的这莫多时间就如同人在黑夜中一样,大脑是在休息的状态.这是第一 ...
- hadoop 》》 django 简单操作hdfs 语句
>> from django.shortcuts import render # Create your views here. from hdfs.client import Clien ...
- 》》jqurey mobile 初
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta na ...
- 实体类在Windows程序中的高级应用--------------------》》心境是一种境界。
一.事务 我们在大家学到这,或多或少对事务都有一些理解了.今天的我也对事务有了更深一层的理解对我来说,我想与大家一起分享一下. 解析: 1.ADO.NET提供了事务处理功能 2.C#中开启事务 3.在 ...
- eclipse更改workspace中出现The superclass "javax.servlet.http.HttpServlet" was not found on the Java----问题》》
第一步:那是因为在项目中没有告诉它应该在哪个tomcat中运行,右击项目名称----->build path-->configure path---->library------ ...
随机推荐
- SSH服务详解
第1章 SSH服务 1.1 SSH服务协议说明 SSH 是 Secure Shell Protocol 的简写,由 IETF 网络工作小组(Network Working Group )制定:在进行数 ...
- ASP.NET Core的身份认证框架IdentityServer4(5)- 包和构建
包和构建 IdentityServer有许多nuget包 IdentityServer4 nuget | github 包含IdentityServer核心对象模型,服务和中间件. 仅支持内存配置和用 ...
- hadoop2 YARN/Mv2中 ApplicationMaster相关问题及介绍
ApplicationMaster是什么? ApplicationMaster是一个框架特殊的库,对于Map-Reduce计算模型而言有它自己的ApplicationMaster实现,对于其他的想要运 ...
- 设备类型检测大全---userAgent
对各种类型的设备的检测,以及所使用的浏览器的类型 function detect(ua) { var os = this.os = {}; var browser = this.browser = { ...
- JavaScript instanceof 运算符深入剖析【转载】
http://www.ibm.com/developerworks/cn/web/1306_jiangjj_jsinstanceof/ instanceof 运算符简介 在 JavaScript ...
- Git Submodules are not SVN Externals
一直在寻找Git跟TFS里面类似SVN Externals的替代方案, 今天终于找到了GIT里面的替代方案,在此做个备注 http://alexking.org/blog/2012/03/05/git ...
- linux下socket编程实例
linux下socket编程实例一.基本socket函数Linux系统是通过提供套接字(socket)来进行网络编程的.网络的socket数据传输是一种特殊的I/O,socket也是一种文件描述符.s ...
- 从零开始搭建Vue组件库 VV-UI
前言: 前端组件化是当今热议的话题之一,也是我们在开发单页应用经常会碰到的一个问题,现在我们有了功能非常完善的Element-UI.各个大厂也相继宣布开源XXX-UI.但是也会存在一些问题,比如每个公 ...
- jQuery+ajax实现局部刷新
在项目中,经常会用到ajax,比如实现局部刷新,比如需要前后端交互等,这里呢分享局部刷新的两种方法,主要用的是ajax里面的.load(),其他高级方法的使用以后再做详细笔记. 第一种: 当某几个页面 ...
- [转载] 红黑树(Red Black Tree)- 对于 JDK TreeMap的实现
转载自http://blog.csdn.net/yangjun2/article/details/6542321 介绍另一种平衡二叉树:红黑树(Red Black Tree),红黑树由Rudolf B ...