JQuery

JQuery总结

JQuery遍历
each() 方法规定为每个匹配元素规定运行的函数。

提示：返回 false 可用于及早停止循环。
jQuery.each()方法几种用法
选择器.each(callback)，回调函数不带参数
$(selector).each(function(){

});
输出每个 li 元素的文本：
$ (“button”).click(function(){
$ (“li”).each(function(){
alert($ (this).text())
});
});

selector
Type: Object
jQuery的选择器
jQuery.each( array, callback )，回调函数带数组索引和数组索引对应值
jQuery.each( array, callback )

object
Type: Object
The object to iterate over.
callback
Type: Function( String propertyName, Object valueOfProperty )
The function that will be executed on every value.
输出一个数组的索引值+数组索引对应值

$.each([ 52, 97 ], function( index, value ) {
alert( index + ": " + value );
});

jQuery.each( object, callback )，回调函数带对象key和对象value
jQuery.each( object, callback )

object
Type: Object
The object to iterate over.
callback
Type: Function( String propertyName, Object valueOfProperty )
The function that will be executed on every value.
输出一个json对象的key值和value值
复制代码

var obj = {
“flammable”: “inflammable”,
“duh”: “no duh”
};
$.each( obj, function( key, value ) {
alert( key + ": " + value );
});
JQuery节点
每一个元素都是一个节点，跟js的差不多一样的但是选择方式不一样
查找节点，新建节点，插入节点，在这里可以看得出查找节点和新建节点有点像，不用刻意区分它们，反而更好记了。这里主要讲一下插入节点的四种常用方法：

append() - 在被选元素的结尾插入内容

prepend() - 在被选元素的开头插入内容

after() - 在被选元素之后插入内容

before() - 在被选元素之前插入内容
ajax传值
1、contentType :表示设置请求的参数格式，默认为application/x-www-form-urlencoded; charset=UTF-8，表示表 单提交；如果所传参数为json格式，则可写为application/json。

2、dataType:表示从后台获取到的参数格式，一般为json。

3、JSON.stringify()可以将对象转化为字符串 ，JSON.parse()表示将字符串解析为json对象。

4、如果后台控制器有@RequestBody的注解，必须将所传的类型解析为字符串（可通过JSON.stringify()），并且还 需在ajax中添加contentType，否则后台会默认将所传参数转化 为param=value格式或者乱码

5、@ReponseBody表示返回的参数，要在控制器@RequestMapping中声明类型和格式，一般为（value=“”，produces=“text/html;charset-utf-8”）。
JQuery选择器类型/区别/使用
jQuery选择器是通过标签、属性或者内容对HTML内容进行选择，选择器运行对HTML元素组或者单个元素进行操作。

jQuery选择器使用$符号，等同于jquery，例如： $(“li”) = jquery(“li”)

同样等同于javascript中的：document.getElemmentsByTagName/id/class语句；
元素选择器

$(“P”); //选择P元素，注意P为大写；

$(“ #container”); //选择id=”container”的元素；

$(“ .articles”); //选择class=”articles”的元素；

$(“.promo”, ”#france”); //id与class混合选择，用 “,”分隔开；
属性选择器
jQuery使用XPath表达式来选择带有给定属性的元素：

$(“[href]”) 选择所有带有href属性的元素；

$(“href=’#’”) 选取所有带有href值等于“#”的元素；

$(“href!=’#’”) 选取所有带有href值不等于“#”的元素；

$ (“href$=’.jpg’”)选取所有href值以”.jpg”结尾的元素；
CSS选择器
jQuery CSS选择器可用于改变HTML元素的CSS属性

$(“P”).css(“background-color”,”red”);
其他选择器语法
$(this) 当前HTML元素
$(“P”) 所有< P >元素
$(“p.intro”) 所有class=”intro”的< P>元素
$(“.intro”) 所有class=”intro”的元素
$(“ul li:first”) 每个< ul>的第一个< li>元素
$(“[href $=’.jpg’]”) 所有带有以“.jpg”结尾的属性值的href元素
$(“div#intro.head”) id=”intro”的< div>元素中的所有class=”head”的元素

选择指定元素下的所有子元素
$(“#destinations li”); //选中id为destinations下所有的li子元素；
选择直属子元素

$(“#destionations > li”); //使用“>”符号选择直属子元素，与不加“>”符号的区别为//只为#destionations下一个层次的子元素，不包括子子元素；

伪选择器

first（第一个） last（最后一个） odd（奇数个） even（偶数个）

伪选择器的语法为在子元素名称后面加“：”号，加参数；

$(“#destionations li:frist”);

$(“#destionations li:last”);

$(“#destionations li:odd”);

$(“#destionations li:even”);

JSON

JSON是一种轻量级的数据交换格式。它基于ECMAScript的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。
​ 优点：

易于开发者阅读及编写

易于机器解析和生成

有效地提升网络传输效率

缺点：

没有XML格式这么推广的深入人心和喜用广泛，没有XML那么通用性；

JSON格式目前在Web Service中推广还属于初级阶段。

语法规则

对象表示为键值对
数据由逗号分隔
花括号保存对象
方括号保存数组

json简单说就是javascript中的对象和数组

JSON的两种结构

对象(object)
json对象：对象在json中表示为“{}”括起来的内容。
数据结构：键值对的结构。具体如下
{key：value,key：value,…} 。
在面向对象的语言中，key为对象的属性，value为对应的属性值，所以很容易理解，取值方法为: object.key 获取属性值，这个属性值的类型可以是 数字、字符串、数组、对象几种。
数组(Array)

数组在json中是中括号“[]”括起来的内容。 数据结构为 [“java”,“javascript”,“vb”,…]。

取值方式和所有语言中一样，使用索引获取，字段值的类型可以是 数字、字符串、数组、对象几种。

$（this）和this关键字在jq中有何不同？

$（this）表示的是用jq封装后的当前对象

this表示的是js提供的当前对象