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基础学习篇章二
一. Python如何运行程序 1. 在交互模式下编写代码 最简单的运行Python程序的方法是在Python交互命令行中输入程序.当然有很多方法可以开始这样的命令行,比如IDE,系统终端.如果你已经 ...
- LAMP 搭建
p { margin-bottom: 0.25cm; line-height: 120% } LAMP 搭建 承 Ubuntu 17.10.1安装, 定制. 参考 电子工业出版社, Ubuntu完美应 ...
- JS 实现MVC的写法
案例:当select 下拉选择框值变化时,显示其值(不是文本) 常规写法 <h3>JavaScript no MVC</h3> <div> <selec ...
- html5shiv.js和respond.min.js的作用
html5shiv:解决ie9以下浏览器对html5新增标签的不识别,并导致CSS不起作用的问题. respond.min:让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览 ...
- T410升级笔记
T410 win7 旗舰版 32 sp1 三星 DDR3 1066 mhz core i5 M 540 2.53GHZ 双核 日立 HTS725032A9A364 320G/7200转/分 sa ...
- django的模型类管理器-----------数据库操作的封装
模型实例方法 str():在将对象转换成字符串时会被调用. save():将模型对象保存到数据表中,ORM框架会转换成对应的insert或update语句. delete():将模型对象从数据表中删除 ...
- Qt QFile文件读写
QFile 需要添加 #Include <QFile> 集成至QIODevice 打开一个文件有3种方式QIODevice::(ReadOnly/WriteOnly/ReadWrite) ...
- Menubutton按钮弹出菜单
#按钮弹出菜单 from tkinter import * root =Tk() def callback(): print('我被调用了') m = Menubutton(root,text = ' ...
- Python中的上下文管理器和with语句
Python2.5之后引入了上下文管理器(context manager),算是Python的黑魔法之一,它用于规定某个对象的使用范围.本文是针对于该功能的思考总结. 为什么需要上下文管理器? 首先, ...
- 功能整合(一):滚动条的变相隐藏、js控制div的渐变显示、滚动条监听
1.滚动条的变相隐藏 思路: 1. 把body的横向,纵向的超出部分隐藏,宽设置100%:高设置100%.就没有body的滚动条了, 2. 然后把最外层的div的宽设置的比body的宽宽一点,把d ...