jQuery简单笔记
jQuery 是一个 JavaScript 库,简化了 JavaScript 的编程。
语法:$(selector).action()
selector 是字符串,表示HTML元素。
对象 | 符号 | 例子 | 效果 |
---|---|---|---|
当前整个HTML | this | this | 选择整个HTML |
标签 | 标签名 | "p" | 选择所有<p>元素 |
id | # | "#test" | 选择所有 id = "test"的元素 |
class | . | ".test" | 选择所有 class = "test"的元素 |
链接 | [] | [href="test"] | 选择所有 href 等于 "test"的元素 |
[href!="test"] | 选择所有 href 不等于 "test"的元素 | ||
[href$="test"] | 选择所有 href 以 "test" 结尾的元素 | ||
表格 | ul li: | "ul li:first" | 选择每个 <ul> 的第一个 <li> 元素 |
以上三者可以合起来用:$("p#test.test")
action()列表:
隶属 | 名称 | 功能 |
---|---|---|
document | ready(function) | HTML文档加载完毕时执行function |
window | 浏览器视口 | |
所有元素 | hide() | 隐藏所选元素 |
show() | 显示所选元素 | |
toggle() | 以上两者切换 | |
fadeIn() | 渐渐隐藏 | |
fadeOut() | 渐渐显示 | |
fadeToggle() | 以上两者切换 | |
slideUp() | 向上滑动隐藏元素 | |
slideDown() | 向下滑动显示元素 | |
slideToggle() | 以上两者切换 | |
addClass() | 添加一个或多个类 | |
removeClass() | 删除一个或多个类 | |
toggleClass() | 以上两者切换 | |
mouseover(function) | 鼠标悬停在元素上时执行function | |
focus(function) | 元素获得焦点时执行function | |
click(function) | 点击元素时执行function | |
dblclick(function) | 双击元素时执行function | |
attr() | 改变元素的属性 | |
css() | 改变或返回元素的css属性 | |
animate({dict参数}) | 执行动画以使元素符合参数指定内容(属性名用骆驼命名法) | |
stop(bool,bool) | 停止动画 | |
text() | 设置或返回所选元素的文本内容 | |
html() | 设置或返回所选元素带 HTML 标记的内容 | |
val() | 设置或返回表单字段的值 | |
append(string) | 元素内容结尾添加 | |
after(string) | 元素结束之后添加 | |
remove() | 删除整个元素 | |
empty() | 删除子元素 | |
width() | 不包括 padding 和 border | |
height() | 不包括 padding 和 border | |
innerWidth() | 包括 padding | |
innerHeight() | 包括 padding | |
outerWidth() | 包括 padding 和 border | |
outerHeight() | 包括 padding 和 border | |
当出现动画动作时,可以传入两个参数:
- 毫秒表示动作过渡时长。
- 回调,在动画完成后执行
可在数值前使用 += 和 -= 表示相对值。
在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示。
AJAX:
load()
get()
post()
jQuery简单笔记的更多相关文章
- jquery简单笔记(1) - 基础记录
一.dom对象及jquery对象相互转换 jquery对象转换成dom对象,即 [index] 和 get(index) 第一种方式: var $j = $('#id'); // jquery对象 v ...
- jQuery 学习笔记
jQuery 学习笔记 一.jQuery概述 宗旨: Write Less, Do More. 基础知识: 1.符号$代替document.getElementById( ...
- jQuery学习笔记 - 基础知识扫盲入门篇
jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...
- JQuery学习笔记——层级选择器
JQuery学习笔记--层级选择器 上一篇学习了基础的五种选择,分别是id选择器,class选择器,element选择器,*选择器 和 并列选择器.根据手册大纲,这篇学习的是层级选择器. 选择器: 1 ...
- jQuery学习笔记之Ajax用法详解
这篇文章主要介绍了jQuery学习笔记之Ajax用法,结合实例形式较为详细的分析总结了jQuery中ajax的相关使用技巧,包括ajax请求.载入.处理.传递等,需要的朋友可以参考下 本文实例讲述了j ...
- jQuery:自学笔记(4)——事件与事件对象
jQuery:自学笔记(4)——事件与事件对象 jQuery中的事件 什么是事件 所谓事件,就是被对象识别的操作,即操作对象队环境变化的感知和反应,例如单击按钮或者敲击键盘上的按键. 所谓事件流,是指 ...
- jQuery:自学笔记(2)——jQuery选择器
jQuery:自学笔记(2)——jQuery选择器 基本选择器 说明 jQuery的基本选择器与CSS的选择器相似: 实例 标签选择器 //使用标签选择器更改字体大小 $(div).css('font ...
- jQuery:自学笔记(1)——基础入门
jQuery:自学笔记(1)——基础入门 认识JQuery 1.jQuery概述 jQuery是一个快速.小巧 .功能丰富的JavaScript函数库.它可以实现“写的少,做的多”的目标. jQuer ...
- jQuery学习笔记之插件开发(4)
jQuery学习笔记之插件开发(4) github源码地址 插件:了让原有功能的增强. 1.插件的种类(3种):局部.全局.选择器插件 1.1封装对象方法的插件 这种类型的插件是把一些常用或者重复使用 ...
随机推荐
- 自定义SpringBoot启动banner
序: springboot启动的时候会有一个启动logo似的东西,如图,这个logo似的东西叫做banner,本文小计修改此banner显示与关闭banner.没什么用,有兴趣可以玩玩-- 正文: 自 ...
- kubernetes进阶(02)kubernetes的node
一.Node概念 Node是Pod真正运行的主机,可以物理机,也可以是虚拟机. 为了管理Pod,每个Node节点上至少要运行container runtime(比如docker或者rkt). kube ...
- LXC学习实践(3)快速体验第一个容器
1.搭建第一个 LXC 虚拟计算机 #yum install lxc* 2.安装软件包后要检查 Linux 发行版的内核对 LXC 的支持情况,可以使用下面命令 #lxc-checkconfig #l ...
- 模板引擎Jade详解
有用的符号: | 竖杠后的字符会被原样输出 · 点表示下一级的所有字符都会被原样输出,不再被识别.(就是|的升级版,实现批量) include 表示引用外部文件 短杠说明后面跟着的字符只是一段代码(与 ...
- [机器学习实战]K-近邻算法
1. K-近邻算法概述(k-Nearest Neighbor,KNN) K-近邻算法采用测量不同的特征值之间的距离方法进行分类.该方法的思路是:如果一个样本在特征空间中的k个最相似(即特征空间中最邻近 ...
- Android fragment切换后onresume时报 Attempt to write to field 'int android.support.v4.app.Fragment.mNextAnim'
动态加载fragment以后,调用了remove方法移除Fragment,在返回来的时候报 Attempt to write to field 'int android.support.v4.app. ...
- mysql 索引学习--多条件等值查询,顺序不同也能应用联合索引啦
以前学习这一块的时候,是说:假设建立了联合索引a+b,那么查询语句也一定要是这个顺序才能应用该索引. 那么实际是怎样呢,经过mysql这么多次版本升级,相信mysql已经给我们做了某些优化. 下面是我 ...
- mysql中text数据类型
有个小问题记录下: 需要从第三方api接口获取数据,返回的数据的长度不定,设计表的时候设计成了varchar(256):结果存数据的时候提示表字段长度不够. 一直从300改到500,600,700都一 ...
- 使用新一代js模板引擎NornJ提升React.js开发体验
当前的前端世界中有很多著名的开源javascript模板引擎如Handlebars.Nunjucks.EJS等等,相信很多人对它们都并不陌生. js模板引擎的现状 通常来讲,这些js模板引擎项目都有一 ...
- scrapy-redis使用以及剖析
scrapy-redis是一个基于redis的scrapy组件,通过它可以快速实现简单分布式爬虫程序,该组件本质上提供了三大功能: scheduler - 调度器 dupefilter - URL去重 ...