var json = [{ "name": "baidu", "site": "http://www.baidu.com" },
{ "name": "cnbeta", "site": "http://www.cnbeta.com" },
{ "name": "qb", "site": "http://www.qiushibaike.com" }
];
//遍历json对象
$.each(json, function () {
//this 数组中的每一个json对象
var $td = $("<a href='" + this.site + "'>" + this.name + "</a>");
})
end():返回jquery对象上一次被破坏之前的状态。是指对象包装集被破坏之前
如:$("#id").nextAll().css("background-color","red").end().css("background-color","red");
$("#id").nextAll()已经改变了原来的包装集$("#id"),
$("#id").nextAll().css("background-color","red").end()之后返回的是$("#id")包装集。
andSelf():之前选中的元素加入自己构成新的包装集
$("#id").nextAll().andSelf().end()返回$("#id").nextAll()
案例:淘宝的五星打分实现:
$("#id").preAll().andSelf().text('黄色五角星图标')
$("#id").nextAll().text('☆')
或者:("#id").preAll().andSelf().text('黄色五角星图标').end().end().nextAll().text('☆')
链式编程中的.是针对上一次返回的节点集合的操作
$(input:not(.myclass):not(#id))没有class为.myclass ,id为#id的所有input输入项
$("#tbl tr:not(:first):lt(3)")表格tbl的前三行,不包含第一行,即排除表头的前三行
tbl隔行变色
$("#tbl tr:not(:first):not(:last):even").css("background-color","red");
相对定位:
$("#tbl tr").click(function(){
$("td").text("aaa");//每一行的所有td都设为aaa
但是如果只想设置选中的行,其他行的td内容不设置,需要使用相对定位。
$("td",$(this)).text("aaa");//当前点击的行的所有td设为aaa,其他行不设置
如果只是设置选中行的某一个td,
$("td",$(this)).eq(1).text("aaa");//当前选中行的第二个td设为aaa
})
toggleClass(class):
如果存在(不存在)就删除(添加)一个类。
.css()
.addClass(“myclass”)追加样式
.attr("class","myclass") 会覆盖
$("input[type=text][id!=d1]").css("background-color","red");//id不为d1的所有input文本框
表单对象选择器:
$(#form1:enable)选取表单内的所有启用的元素
$(#form1:disabled)选取表单内的所有禁用的元素
$("input:checked")选取所有选中的元素,radio checkbox
$("select option:selected")选取所有选中的选中元素,下拉框
$("input[type=text]:enable").css("background-color","red");
在each()遍历中结束循环是return false。就相当于break