jquery简单运用

jquery:js 库

官网:http://jquery.com/下载: downloadv3.1.1  -  最新版本3.x2.x1.xPast 

Releases  --  过去发布的版本

See all versions of jQuery Core.  -- 查看所有版本下载:

https://code.jquery.com/jquery/我们用的:jQuery Core 1.7.2    国内使用的,最稳定的版本

1.x  :  亚非拉ie 6 7 8 9 ff  chrome

2.x :    欧美不兼容 ie 6 7 83.

jquery :  用户群:不懂JS的人 (只会切图的前端    后台程序员)简单

原生js: 用户群:专业的前端工程师 难

jquery  能做的    原生 的JS 都能做到反之则不然

=========2016年11月23日 星期三 10:05:18 =========

获取元素:

document.getElementById //  ByTagName

--$('input')

就是css 中的写法

jquery里获取元素: css 中怎么写  jquery 就怎么写

原:  onclick

jq: click  --  事件不带on

*选择器

根据标签名:  $('input')

根据ID: $('#btn1')

根据class: $('.classname')

根据属性来获取:  [属性名='属性值']  //  '  "  交叉用:  外单引里双引,外双引里单引

.eq(2)  按索引找元素

伪类:

:first

:last

:even

:odd

:eq(索引值)

:lt(4)  小于索引值

:gt(4)   大于索引值

:contains(文本)  包含指定文本的 (如:包含 a 字母)

:has(标签名) 包含指定标签的

设置样式:

.css('background','yellow'); //设置一个

.css({'background':'yellow','width':200}); 设置多个样式

显示:  .show()

隐藏: .hide();

切换click事件,可以2个或多个: .toggle

mouseover

mouseout

--和原生的 on  事件,有同样的问题

移上,移走  切换的时候 :  hover

淡入淡出:  fadeIn  fadeOut

下拉显示: slideUp  slideDown

--不推荐使用

动画:animate

--推荐使用

=========2016年11月23日 星期三 12:21:36 =========

样式:

.css('width');  //获取一个样式,带单位  200px

.css('background','yellow'); //设置一个

.css({'background':'yellow','width':200}); 设置多个样式

属性:

.attr('属性名')  //获取一个属性

.attr('name','value'); //设置一个属性

.attr({

name1:'v1',

name2:20

}) //批量设置属性

=========2016年11月23日 星期三 14:27:25 =========

class操作:

addClass

removeClass

内容操作:

非表单元素的内容:

.html()  获取innerHTML

.html(设置的内容)  设置

表单标签:

.val()  获取内容

.val(设置的内容)  设置

=========2016年11月23日 星期三 14:35:40 =========

this:

一般情况下, this  还是原生 js  中的this

原生对象    jquery对象

* 原生对象的属性和方法,不能直接用于 jquery对象

* jquery对象的属性和方法, 不能  直接用于 原生对象

原生  -->  jquery    $(原生)

jquery --> 原生  [0]

=========2016年11月23日 星期三 15:07:32 =========

索引:

.index();

链式操作:

兄弟节点:siblings

=========2016年11月23日 星期三 15:40:31 =========

位置:

原生: offsetLeft  offsetTop

left  top

jquery:

var l = $('#div1').position().left;

var t = $('#div1').position().top;

普通位置:

.positon().left

.position().top

绝对位置:

.offset().left;

.offset().top;

=========2016年11月23日 星期三 16:02:39 =========

物体大小:

width    heigth

宽度:

.width()  普通宽度

.innerWidth() 普通宽度 + padding

.outerWidth() 普通宽度 + padding + border

高度:height

=========2016年11月23日 星期三 16:34:17 =========

事件:=========2016年11月23日 星期三 16:49:20 =========

jquery  都是绑定

.bind();

.unbind();

事件委托:

$('ul').delegate('li','click',function(){

alert($(this).html());

});

$('ul').undelegate();

阻止默认行为:

return false; -- 阻止默认行为 和 事件冒泡

ev.preventDefault();  --  阻止默认行为

ev.stopPropagation()  -- 阻止事件冒泡

=========2016年11月23日 星期三 16:49:20 =========

可视区:

alert($(window).width());

alert($(window).height());

例子:




智能社 - www.zhinengshe.com

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,425评论 4 361
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,058评论 1 291
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,186评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,848评论 0 204
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,249评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,554评论 1 216
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,830评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,536评论 0 197
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,239评论 1 241
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,505评论 2 244
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,004评论 1 258
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,346评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,999评论 3 235
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,060评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,821评论 0 194
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,574评论 2 271
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,480评论 2 267

推荐阅读更多精彩内容

  • 第一章 jQuery简介 1-1 jQuery简介 1.简介 2.优势 3.特性与工具方法 1-2 环境搭建 进入...
    mo默22阅读 1,540评论 0 11
  • 在线阅读 http://interview.poetries.top[http://interview.poetr...
    程序员poetry阅读 113,834评论 24 450
  • 九月一日晚八点五十分家中电视机旁一年一度的开学第一课即将开始 九点整,伴随着开场舞<第一课>我进入了这一年一度的开...
    夜空之上刘星雨阅读 554评论 2 2
  • #摔跤吧爸爸#这周末用腾讯会员看完了这个电影,真的感触颇多,不仅看完的时候哭的一把鼻涕一把泪,而且还想起了自己似乎...
    海绵小凡阅读 169评论 0 0
  • 应家长的要求大学要在家附近选,还记得当时我的老师都想给家长打电话觉得家长太古板,后来还是听家长的话了,因...
    哏都的me阅读 191评论 1 1