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封装对象方法的插件 这种类型的插件是把一些常用或者重复使用 ...
随机推荐
- python全栈开发-json和pickle模块(数据的序列化)
一.什么是序列化? 我们把对象(变量)从内存中变成可存储或传输的过程称之为序列化,在Python中叫pickling,在其他语言中也被称之为serialization,marshalling,flat ...
- SpringCloud的应用发布(四)vmvare+linux,网关代理
一.配置方式 1.代理同一个Eureka中注册的服务 2.代理url 二.访问方式:get - list 1.直接访问应用 2.代理访问应用
- 阿里云API网关(11)API的三种安全认证方式
网关指南: https://help.aliyun.com/document_detail/29487.html?spm=5176.doc48835.6.550.23Oqbl 网关控制台: https ...
- 【已解决】React中配置Sass引入.scss文件无效
React中配置Sass引入.scss文件无效 在react中使用sass时,引入.scss文件失效 尝试很多方法没法解决,最终找到解决方法,希望能帮助正在坑里挣扎的筒子~ 在node_modules ...
- Python入门之函数的嵌套/名称空间/作用域/函数对象/闭包函数
本篇目录: 一.函数嵌套 二.函数名称空间与作用域 三.函数对象 四.闭包函数 ============================================================ ...
- Centos系统运行nodejs
这里我们需要先搭建一下运行的环境,直接yum安装就可以了! [root@iZwz9f80ph5u8tlqp6pi9cZ ~]# yum -y install nodejs 这里我们的环境就搭好了!安装 ...
- angularjs购物车练习
本文是一个简单的购物车练习,功能包括增加.减少某商品的数量,从而影响该商品的购买总价以及所有商品的购买总价:从购物车内移除一项商品:清空购物车. 页面效果如图: 若使用js或jQuery来实现这个页面 ...
- MySQL高可用架构之MHA 原理与实践
MHA简介 关于MHA MHA(Master HA)是一款开源的MySQL的高可用程序,它为MySQL主从复制架构提供了automating master failover 功能.MHA在监控到mas ...
- C# 获取网页源代码
/// <summary> /// 获取网页源代码 /// </summary> /// <param name="url"></para ...
- vue-cli 去掉严格模式:
vue-cli 去掉严格模式: 在根目录中找到 .eslintignore 文件,添加 严格模式需要监听的目录 src/*