Hello JQuery

要使用Jquery需要导入一个第三方的javascript库 jquery.min.js

理解 $(function(){})

$(function(){

});

表示文档加载。看上去略复杂，其实是由下面两种构成：

$();

function(){

}

合并在一起就是：

$(function(){

});

这是为了防止文档在完全加载（就绪）之前运行 jQuery 代码。

换句话说，写在这里面的JQuery代码都是文档加载好之后的。

就不会有获取一个还没有加载好的图片这种问题了。

一样功能，还有另一个写法

$(document).ready(function(){

});

它也是由两部分组成

$(document).ready();

function(){

}

通过id获取元素

与javascript通过id获取元素节点的方式document.getElementById ("id")不同

JQuery通过$("#id")就可以获取了

需要注意的是，通过 document.getElementById 获取到的是DOM里的元素节点

而通过$("#id") 获取到的是一个JQuery 对象

参考DOM的元素节点与 JQuery 对象互换

增加监听器

$("#b1").click(function(){

alert("点击了按钮");

});

这个也是由两部分组成：

1. b1按钮的点击事件

$("#b1").click();

2. 弹出对话框的函数

function(){

alert("点击了按钮");

}

与原生javascript需要在html元素上增加监听事件不同的是

JQuery 不需要在html元素上进行操作

这样的好处是，html只需要显示内容，特别是业务复杂起来之后维护js代码会更加容易。

常见方法

val 取值

html 获取元素内容,如果有子元素，保留标签

text 获取元素内容,如果有子元素，不包含子元素标签

1.val 取值

通过JQuery对象的val()方法获取值

相当于 document.getElementById("input1").value;

获取元素内容,如果有子元素，保留标签

获取元素内容,如果有子元素，不包含子元素标签

JQery对ajax的支持

$.ajax采用参数集的方式 {param1,param2,param3} 不同的参数之间用（逗号“,”）隔开

第一个参数url:page 表示访问的是page页面

第二个参数data:{name:value} 表示提交的参数

第三个参数success: function(){} 表示服务器成功返回后对应的响应函数

使用post方式提交ajax

最简单的调用ajax的方式

格式化form下的输入数据

serialize()：格式化form下的输入数据

有的时候form下的输入内容比较多，一个一个的取比较麻烦，就可以使用serialize() 把输入数据格式化成字符串

将JSON格式的字符串，转换为JSON对象

选择器

事件

JQuery