2014年辛星jquery解读第二节

*************jquery的语法******************

1.jquery是通过选取HTML元素,并且对选取的元素执行某些操作,从而完成某些特效的。

2.因此,我们在使用jQuery的时候经常会看到如下的操作方式:$(选择器).功能()

3.这里的$符号是一个快捷操作符,而它后面的小括号里面的选择器则指出了我们要错做的HTML元素,然后我们执行这个action来对元素完成操作。

4.比如:$("p").hide() 这也是上一节我们用到的一种方式,我们可以用它去隐藏p标签里面的内容。

5.jQuery的选择器是xPath与CSS选择器语法的结合。

**************一点说明*********************

1.如果大家仔细读了我们上一节的示例代码,会发现我们所有的代码都是写在一个函数里的,下面我们用伪代码的形式描述一下:

$(document).ready(
    //我们的其他代码
);

2.它的意思是等文档全部加载完毕之后再去执行相应的代码,如果文档没有完全加载,那么可能有些操作会失败,比如我们试图操作一个原本不存在的元素的时候,就会导致操作失败。

************选择器************************

1.从上面我们也了解到,jQuery能够通过选择器来找到正确的HTML元素是非常重要的,因为只有这样,后续进行的操作才会有效,我们的效果才会显示出来。

2.jQuery允许我们队HTML元素或者单个元素进行操作。

3.jQuery选择器允许我们通过元素的id,class、类型、属性、属性值等找到该HTML元素,它的语法很像我们的CSS选择器。

4.jQuery在查找选择器的时候都必须以$()开头。

5.下面我们给几个例子,比如$("p")是选择了所有的p标签,比如$("#xin")是选择了id为xin的HTML元素,比如$(".xin")是选择了所有的class属性为xin的HTML元素。

************事件*********************

1.为了让我们的web页面与用户的交互更加友好,我们的jQuery提供了强大的处理事件的能力。

2.事件处理程序就是当HTML中发生某些事情的时候所调用的方法,如果大家有GUI界面编程知识的话,那么它非常容易理解。

3.比如常见的DOM事件中的鼠标事件就有click(点击)、dbclick(双击)、mouseenter(鼠标进入区域)、mouseleave(鼠标离开该区域),键盘事件就有keypress(键盘的键被按下)、keydown(键被按下)、keyup(键被松开)等。

4.这里有必要说一下的就是表单事件,比如submit(提交)、chane(修改)、foucus(获得焦点)、blur(失去焦点)等主要事件,还有就是文档和窗口的load(加载)、resize(大小改变)、scroll(滚动)、unload(用户离开页面)。

5.比如;我们点击某个p标签的时候要触发一个事件,那么就可以用$("p").click();

6.那我们在click函数中写什么呢,我们可以通过定义一个Javascript函数来实现。

7.通常对于大多数DOM事件我们都有一个与之等效的jQuery方法。

*************常用方法**************

1.$(document).ready():它是等文档完全加载完毕之后执行的操作。

2.click()方法是鼠标点击事件。

3.mouseenter()方法是鼠标指针穿过元素的事件。

4.mouseleave()方法是鼠标指针离开元素的事件。

5.mousedown()方法是鼠标指针移动到元素上方并且按下鼠标左键的事件。

6.mouseup()方法是鼠标指针移动到元素上方并且松开鼠标的时间。

7.hover()方法用于光标悬停在元素上方,它接受两个函数,一个用于鼠标进入,一个用于鼠标离开。

8.focus()方法用于获得焦点事件,大多是鼠标点击选中或者通过tab键定位到某个元素。

9.blur()方法用于HTML元素失去焦点的时候的事件。

*************外部js文件*****************

1.我们可以把代码写入到另外一个js文件中,然后在导入我们写的js文件和jQuery文件即可。

2.注意要先导入jQuery文件,导入格式就是如下:

<head>
<script src="jquery.js"></script>
<script src="myjs.js"></script>
</head>

**************小结***************

1.本小节我们到此就结束了,它让我们知道了我们如何使用jQuery库。

2.使用方式就是等文档加载完毕之后,调用$(选择器).功能函数 这种格式去操纵。

时间: 2024-11-13 07:24:22

2014年辛星jquery解读第二节的相关文章

2014年辛星Javascript解读第二节

本小节我们讲解一下Javascript的语法,虽然js语言非常简单,它的语法也相对好学一些,但是不学总之还是不会的,因此,我们来一探究竟把. ********注释************* 1.我们通常用注释来标记一些代码,它会使得我们更好理解我们之前写过的程序代码,这些注释不会被解释执行,但是它是非常有用的. 2.Javascript支持以C++风格的//开头的单行注释,即两个斜线之后的部分直到这一行的结束,都会被当做注释来对待,它们是不会被计算机解释执行的. 3.Javascript还支持C

2014年辛星jquery解读第三节 Ajax

***************Ajax********************* 1.Ajax是Asynchronous Javascript And  XML的简写,它指的是异步Javascript和XML.简单来说,就是不刷新整个页面的情况下来和server端进行数据的交互,而且可以在网页上进行显示. 2.jQuery对Ajax的支持还是比較完好的.它能够让我们以GET或者POST方式从server读取信息,而且显示它. 3.jQuery通过以下几个方法对Ajax进行支持. ********

2014年辛星Javascript解读第一节

***************概述*************** 1.Javascript是一种原型化继承的基于对象的动态类型的脚本语言,它区分大小写,主要运行在客户端,用户即使响应用户的操作并进行数据的解析和传递. 2.Javascript和Java并没有太多的关系,只是名字重复了四个字母. 3.Javascript的主要功能是进行数据验证.提供网页特效,动态响应用户的操作,我们提到Javascript也通常会提到jQuery和Ajax. ************Javascript的历史**

2014年辛星完全解读Javascript第六节 对象

随着面向对象的普及,现在很多语言都在支持面向对象,Javascript也不例外,所谓对象,就是拥有属性和方法的数据.这里的属性其实就是变量,这里的方法,其实就是函数.但是Javascript的面向对象和其他编程语言还是有很大区别的. ************对象************* 1.Javascript中的对象的定义“属性的无序集合,每个属性存放一个初始值.函数或者对象”,也就是说,对象是没有额定顺序的值的数组. 2.Javascript中的对象一般可以分为本地对象.内置对象.宿主对象

2014年辛星完全解读Javascript第七节 数组和对象

由于Javascript是脚本语言,因此,使用起来非常方便,数组的使用也是比较简单的,下面我们就主要介绍一下Javascript中数组的介绍,以及上一节中没有完成的对象的介绍. **************数组************** 1.在Javascript中,声明一个数组太简单了,而且它支持三种方式,第一种方式是直接实例化一个Array,然后用下标的形式去添加,但是它不像PHP那样灵活,它不允许不写下标就向里面添加数据,因此,我们指定下标即可. 2.访问数组的成员就向C语言的数组那样访

2014年辛星完全解读Javascript第八节 json

json是JavaScript Object Notation的简写,它是一种轻量级的数据交换格式,而且表达上很容易靠字面去理解.json是用于存储和传输数据的格式,通常用于向服务器端传递数据. *************JSON************** 1.我们上一节介绍了对象,这一节我们将介绍json,json既然是一种数据的传输方式,那么它也必然会有自己的语法规则,它的语法规则如下:由大括号保存对象,由方括号保存数组,数据以键值对的方式存储,而且多个数据之间需要用逗号分开. 2.比如下

2014年度辛星完全解读html第二节

上面一节中我们介绍了HTML文件的书写和几个标签,接下来我们来认识几个其他的标签,这里我们主要介绍一下head标签和文本标签. ***************head标签************************ 1.所谓head,就是头的意思,它可以包含若干子标签,它的内容是不会再浏览器的文本区域显示的,但是它的作用非常广泛,下面我们重点介绍一下它的子标签. 2.head标签可以包含title标签,上面我们已经看到了,而title标签就是在浏览器的标题栏显示的内容,这点我们上节说了. 3

2014年辛星Javascript解读第四节 流程控制语句

上一节我们介绍了函数,本小节我们介绍一下流程控制语句,对于不论什么一门编程语言来说,流程控制都是很重要的,也就是我们常说的顺序结构.选择结构和循环结构. ************选择结构*************** 1.Javascript中用条件语句来实现选择结构,它提供的选择结构主要是if语句.if....else语句和if...else if ...else语句,另一个switch语句,和PHP非常像. 2.这些语句都比較基础,因此我们这里仅仅给出if...else if..else的形

2014年辛星Javascript解读第五节 break continue 与异常处理

先说一下break和continue的主要用法吧,break用于跳出循环,continue用于跳过该循环中的一个迭代.简单的说,就是break直接从该语句跳出,但是continue不会跳出该循环语句,但是它会重新来过,即本次不会再次执行. ************具体说明************* 1.我们通过举例的形式来说明,首先看代码一: var sum = 0; for(i = 0;i<10;i++){ if(i==5){ break; } sum += i; } alert(sum);