摘要: jQuery中each方法的应用 jQuery中有个很重要的核心方法each,大部分jQuery方法在内部都会调用each,其主要的原因的就是jQuery的实例是一个元素合集 如下:找到所有的div,并且都设置样式,css只是一个方法,所以内部会调用each处理这个div的合集,给每个div都设置s 阅读全文
posted @ 2017-11-03 20:27 欧阳贝贝 阅读(194) 评论(0) 推荐(0) 编辑
摘要: jQuery中动画animate(上) 有些复杂的动画通过之前学到的几个动画函数是不能够实现,这时候就需要强大的animate方法了 操作一个元素执行3秒的淡入动画,对比一下2组动画设置的区别 $(elem).fadeOut(3000) $(elem).animate({ opacity:0 },3 阅读全文
posted @ 2017-11-03 20:10 欧阳贝贝 阅读(296) 评论(0) 推荐(0) 编辑
摘要: jQuery中toggle与slideToggle以及fadeToggle的比较 操作元素的显示和隐藏可以有几种方法。例如: 改变样式display为none 设置位置高度为0 设置透明度为0 都能达到这个目的,并且针对这样的处理jQuery都提供了各自的方法。show/hide、sildeDown 阅读全文
posted @ 2017-11-03 19:58 欧阳贝贝 阅读(2782) 评论(0) 推荐(0) 编辑
摘要: jQuery中淡出动画fadeOut 让元素在页面不可见,常用的办法就是通过设置样式的display:none。除此之外还可以一些类似的办法可以达到这个目的。这里要提一个透明度的方法,设置元素透明度为0,可以让元素不可见,透明度的参数是0~1之间的值,通过改变这个值可以让元素有一个透明度的效果。常见 阅读全文
posted @ 2017-11-03 19:57 欧阳贝贝 阅读(1248) 评论(0) 推荐(0) 编辑
摘要: jQuery中下拉动画slideDown 对于隐藏的元素,在将其显示出来的过程中,可以对其进行一些变化的动画效果。之前学过了show方法,show方法在显示的过程中也可以有动画,但是.show()方法将会匹配元素的宽度,高度,以及不透明度,同时进行动画操作。这里将要学习一个新的显示方法slideDo 阅读全文
posted @ 2017-11-03 19:49 欧阳贝贝 阅读(273) 评论(0) 推荐(0) 编辑
摘要: jQuery中隐藏元素的hide方法 让页面上的元素不可见,一般可以通过设置css的display为none属性。但是通过css直接修改是静态的布局,如果在代码执行的时候,一般是通过js控制元素的style属性,这里jQuery提供了一个快捷的方法.hide()来达到这个效果 $elem.hide( 阅读全文
posted @ 2017-11-03 19:43 欧阳贝贝 阅读(346) 评论(0) 推荐(0) 编辑
摘要: jQuery自定义事件之trigger事件 众所周知类似于mousedown、click、keydown等等这类型的事件都是浏览器提供的,通俗叫原生事件,这类型的事件是需要有交互行为才能被触发。 在jQuery通过on方法绑定一个原生事件 $('#elem').on('click', functio 阅读全文
posted @ 2017-11-03 19:35 欧阳贝贝 阅读(453) 评论(0) 推荐(0) 编辑
摘要: jQuery事件对象的作用 事件中的Event对象容易被初学者忽略掉,可能大多时候初学者不知道怎么去用它,但有些时候它还是非常有用的 一个标准的"click"点击事件 $(elem).on("click",function(event){ event //事件对象 }) 在不同浏览器之间事件对象的获 阅读全文
posted @ 2017-11-03 19:34 欧阳贝贝 阅读(612) 评论(0) 推荐(0) 编辑
摘要: on()的多事件绑定 之前学的鼠标事件,表单事件与键盘事件都有个特点,就是直接给元素绑定一个处理函数,所有这类事件都是属于快捷处理。翻开源码其实可以看到,所有的快捷事件在底层的处理都是通过一个"on"方法来实现的。jQuery on()方法是官方推荐的绑定事件的一个方法。 基本用法:.on( eve 阅读全文
posted @ 2017-11-03 19:32 欧阳贝贝 阅读(3336) 评论(0) 推荐(0) 编辑
摘要: jQuery键盘事件之keydown()与keyup()事件 鼠标有mousedown,mouseup之类的事件,这是根据人的手势动作分解的2个触发行为。相对应的键盘也有这类事件,将用户行为分解成2个动作,键盘按下与松手,针对这样的2种动作,jQuery分别提供了对应keydown与keyup方法来 阅读全文
posted @ 2017-11-03 19:30 欧阳贝贝 阅读(1523) 评论(0) 推荐(0) 编辑
摘要: jQuery表单事件之blur与focus事件 在之前2.8与2.9节我们学过了表单处理事件focusin事件与focusout事件,同样用于处理表单焦点的事件还有blur与focus事件 它们之间的本质区别: 是否支持冒泡处理 举个简单的例子 <div> <input type="text" /> 阅读全文
posted @ 2017-11-03 19:29 欧阳贝贝 阅读(1611) 评论(0) 推荐(0) 编辑
摘要: jQuery鼠标事件之click与dbclick事件 用交互操作中,最简单直接的操作就是点击操作。jQuery提供了两个方法一个是click方法用于监听用户单击操作,另一个方法是dbclick方法用于监听用户双击操作。这两个方法的用法是类似的,下面以click()事件为例 使用上非常简单: 方法一: 阅读全文
posted @ 2017-11-03 19:26 欧阳贝贝 阅读(5140) 评论(0) 推荐(0) 编辑
摘要: jQuery遍历之children()方法 jQuery是一个合集对象,如果想快速查找合集里面的第一级子元素,此时可以用children()方法。这里需要注意:.children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈,这里可以理解为就是父亲-儿子的关系) 理解节 阅读全文
posted @ 2017-11-03 14:48 欧阳贝贝 阅读(206) 评论(0) 推荐(0) 编辑
摘要: DOM拷贝clone() 克隆节点是DOM的常见操作,jQuery提供一个clone方法,专门用于处理dom的克隆 .clone()方法深度 复制所有匹配的元素集合,包括所有匹配元素、匹配元素的下级元素、文字节点。 clone方法比较简单就是克隆节点,但是需要注意,如果节点有事件或者数据之类的其他处 阅读全文
posted @ 2017-11-03 11:48 欧阳贝贝 阅读(2313) 评论(0) 推荐(0) 编辑
摘要: DOM节点删除之empty()的基本用法 要移除页面上节点是开发者常见的操作,jQuery提供了几种不同的方法用来处理这个问题,这里我们开仔细了解下empty方法 empty 顾名思义,清空方法,但是与删除又有点不一样,因为它只移除了 指定元素中的所有子节点。 这个方法不仅移除子元素(和其他后代元素 阅读全文
posted @ 2017-11-03 10:43 欧阳贝贝 阅读(1411) 评论(0) 推荐(0) 编辑
摘要: DOM内部插入append()与appendTo() 动态创建的元素是不够的,它只是临时存放在内存中,最终我们需要放到页面文档并呈现出来。那么问题来了,怎么放到文档上? 这里就涉及到一个位置关系,常见的就是把这个新创建的元素,当作页面某一个元素的子元素放到其内部。针对这样的处理,jQuery就定义2 阅读全文
posted @ 2017-11-03 10:28 欧阳贝贝 阅读(169) 评论(0) 推荐(0) 编辑
摘要: DOM创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作。但实际上一般开发者都习惯性的先定义好HTML结构,但这样就非常不灵活了。 试想下这样的情况:如果我们通过AJAX获取到数据之后然后才能确定结构的话,这种情况就需要动态的处理节点了 本文向大家介绍 阅读全文
posted @ 2017-11-03 10:19 欧阳贝贝 阅读(767) 评论(0) 推荐(0) 编辑
摘要: jQuery的属性与样式之.attr()与.removeAttr() 每个元素都有一个或者多个特性,这些特性的用途就是给出相应元素或者其内容的附加信息。如:在img元素中,src就是元素的特性,用来标记图片的地址。 操作特性的DOM方法主要有3个,getAttribute方法、setAttribut 阅读全文
posted @ 2017-11-03 10:14 欧阳贝贝 阅读(522) 评论(0) 推荐(0) 编辑
摘要: jQuery选择器之id选择器 页面的任何操作都需要节点的支撑,开发者如何快速高效的找到指定的节点也是前端开发中的一个重点。jQuery提供了一系列的选择器帮助开发者达到这一目的,让开发者可以更少的处理复杂选择过程与性能优化,更多专注业务逻辑的编写。 jQuery几乎支持主流的css1~css3选择 阅读全文
posted @ 2017-11-03 10:11 欧阳贝贝 阅读(288) 评论(1) 推荐(0) 编辑
摘要: jQuery对象与DOM对象 对于才开始接触jQuery库的初学者,我们需要清楚认识一点: jQuery对象与DOM对象是不一样的 可能一时半会分不清楚哪些是jQuery对象,哪些是DOM对象,下面重点介绍一下jQuery对象,以及两者相互间的转换。 通过一个简单的例子,简单区分下jQuery对象与 阅读全文
posted @ 2017-11-03 10:06 欧阳贝贝 阅读(144) 评论(0) 推荐(0) 编辑