//筛选出name以 “$chkIsLock” 结尾的 checkbox 控件,返回值类型:数组
$("input[type='checkbox'][name$='$chkIsLock']");
1、//将一个JQuery对向转化为DOM对象
var a = $("#div1")[0] 或者 var a = $("#div1").get(0)
2、//Jquery选择器
$("body *") //取得body下所有的元素
$("div, #abc, p .myclass") //选择所有div,所有span, 所有p 且类名为myclass
$(".classname") //查找有css的元素
$("#abc span"); //选择#abc下的所有儿子孙子span元素(多层)
$("#abc > span") //选择#abc下的儿子span元素(孙子不管)
$("#abc + span") = $("#abc").next("span") //选取#abc下的紧挨着的一个span兄弟元素
$("#abc ~ span") = $("#abc").nextAll("span") //选取#abc后面的所有span兄弟元素(只要是兄弟都可以,前面的不管)
$("#abc").).siblings("div") //找到兄弟层的div
//下面这些过滤选取器,从后往前读
$("div:first") //选取第一个div元素
$("div:last") //选取最后一个div元素
$("input:not(.myclass)") //选取class不是myclass的input元素
$("tr:even") //选取索引是偶数的tr 从0开始
$("tr:odd") //选取索引是奇数的tr 从0开始
$("tr:eq(1)") //选取索引等于2的元素
$("tr:gt(1)") //选取索引大于1的元素,不包括1
$("tr:lt(1)") //选取索引小于1的元素,不包括1
$("div:contains('我们')") //选取内容含有"我们"的div元素
$("div:has(p)") //选取含有p元素的div元素
$("div:parent") //选取拥有子元素(含文本元素)的div元素
$("div:empty") //和上面对应,选取为空(不含元素及文本)的div
$("div:hidden") //选取蕴藏的div
$("div:visible") //选取所有可见的div
$("div:animated") 选取正在执行动画的div元素
$("div[id]") //选取拥有属性id的元素
$("div[id=div1]") 选取id属性为div1的div
$("div[id!=div1]")
$("div[title=test]") //选取属性title为"test"的div
$("div[title!=test]") //选取属性title不为"test"的div
$("div[title^=test]") //选取属性title以"test"开始的div
$("div[title$=test]") //选取属性title以"test"结束的div
$("div[title*=test]") //选取属性title含有"test"的div
$("div[id][title*=test]") //选取拥有属性id 并且属性title含有"test"的div
$("input[type=checkbox]") //取得所有的checkbox也可以写成: $(":checkbox");
$("ul li:first-child") //选取每个ul 中第一个li
$("ul li:last-child") //选取每个ul 中最后一个li
$("ul li:only-child") //选取每个ul 只有一个子元素的li
$("form :enabled") //选取form下的所有可用的元素
$("form :disabled") //选取form下的所有不可用的元素
$("input:checked") //选取所有被选中的input元素
$("select:selected") //选取所有被选中的选项元素
$("#div1 li:even", $(this)) //相对选择器,第二个参数传递一个jquery对象,则相对于这个对象为基准进行相对选择
//区别
$("#myform :input") //会获取到所有input textarea select button元素
$("#myform input") //获取到所有的input元素
$(".test :hidden") //选取class为test的元素当中的隐藏子元素(下层)
$(".test:hidden") //选取隐藏的class为test的元素(从后往前读)
$(":input") //包含input、textarea、select、button
$(":text") //选取所有单行文本框. 同理还有:radio :checkbox :submit :image :reset :button :file :hidden
3、属性
e.pageX //鼠标的横坐标
e.pageY
e.target //是最原始的元素(冒泡的起始元素),与this不一样
e.altKey //返回是bool值 shiftKey keyCode(小键盘与主键盘的keyCode不一样) charCode(即是ASC码)
4、JQuery 方法
$("input").length
$("body").children()
$("#abc").css("opacity","0.5"); //将css的透明程度为0.5
$("input").text(); //返回仅是文本
$("input").html(); //返回含html标签文本
$("#div1").show() //元素显示
$("#div1").hide(10000)
$("#div1").toggle() //方法隐藏与显示切换
$("#div1").next(); //方法,获得下一个元素
$("#div1").prev(); //前一元素
$("#div1").next("p") //获得下一个p元素
$("#div1").nextAll() //获得所有
$("#div1").siblings("div") //取得所有兄弟
$("br").replaceWith("<hr/>"); //接点替换
$("p").wrap("<font color='red'></font>"); //wrap方法将所选的元素用指定的标签包裹
attr() //方法用来读取或者设置元素属性,对于Jquery没有封装的属性,例如 $("#cmd1").attr("disabled", true);
attr("class") //获取样式
attr("class","myclass") //设置样式
attr({"name":"name1", "css":"mycss"})
removeAttr()
.addClass("myclass") //追加样式
.removeClass("myclass") //移除样式
.toggleClass("myclass") //判断有无样式,如果有就移除,如果没有就添加
.hasClass("myclass") //判断是否有样式myclass 返回真假
.is(".myclass") //和上面一样是否有class=myclass
.is(":visible") //判断是否可见
//根据html代码动态创建元素
$("div").append("<b>hello</b>"); //在div中的元素最后加
$("div").prepend("<b>hello</b>"); //把后面的加到div中元素最前面去
$("div").after("<b>hello</b>"); //在div后面加入,兄弟节点 还可以实现节点的移动
$("div").before("<b>hello</b>"); //在div前面加入,兄弟节点
var tempdiv = $("#div").remove() //删除选中的元素,返回值为被删除的节点对象 (在移动选择项中常被用,从左移到右)
$("ul li").remove("li[title != 2]"); //将后面条件的元素删除
$("ul li:eq(1)").empty() //清空,元素本身还在
$(this).clone() //复制自己
$(this).clone(true) //复制自己并有以前对象一切方法与属性
$("#div1").replaceWith("<a href='' >aaa</a>"); //替换元素
$("#div1").replaceAll("#div2");
$("p").wrap("<a href='' ></a>") //将p用a包裹起来
$("p").wrapInner("<a href='' ></a>") //p还是在最外层,但p的内容放到a中
5、$.each() 方法与 $.map() 方法
a、//$.map方法对数组中每个元素进行处理,有返回值
<script type="text/javascript">
var a1 = [1, 3, 5];
var a2 = $.map(a1, function (item) {
return item * 2;
});
alert(a2);
b、//$.each方法对数组中每个元素进行处理,没有返回值,对于var a1 = [1, 3, 5];相当于key=序号,value=数组值
var a3 = { "leo": 20, "juanually": 40, "tom": 50 };
$.each(a3, function (key, value) {
alert(key+"的年龄是:"+value);
});
</script>
c、//使用each方法对元素进行遍历
$("input").click(function () {
var arr = new Array();
$("input:checked").each(function (key, value) {
arr[key] = $(value).val(); //给数组付值,注意将Dom对象转成Jquery对象
});
$("#p1").text("共选中:"+arr.length+"项 "+arr.join(",")); //数组的join方法将字符串连起来
});
d、//将所有的checkbox反选
$("#div1 input[type=checkbox]").each(function () {
$(this).attr("checked", !$(this).attr("checked"));
});
6、Jquery事件 return false 含下面二个
e.stopPropagation(); //终止冒泡事件,e:表示匿名函数增加一个参数,e就是事件对象
e.preventDefault(); //方法用来阻止默认行为。相当于window.event.returnvalue = false;
$("input").unbind("click") //取消click事件 ,如不加参数,则取消所有事件
$("#cmd1").one("click",function(){ alter("只执行一次的事件");}) //只执行一次的事件
$("input").trigger("click") //模拟用户click事件
7、动画
$("#dtl").css("opacity", "0.5"); //设定透明度为0.5
$("#div1").toggle(1000); //切换div1隐藏与显示
$("#div1").toggle( 1 == 1 ); //为true是显示, 为假时隐藏
$("#div1").toggle("fast",function(){ alert("Animation Done."); });
$("#dtl").animate({left:"+=200px",height:"400px", opacity:"1"}, 3000, function(){ alert(3);} ); //每次往左200、所需时间、回调函数
.fadeIn(2000) //开始隐藏,利用透明度,最后完全看见
.fadeOut()
.slideUp() //从下往上收起来,最后看不见
.slideDown() //开始隐藏,然后从下往下展开