JQuery基本方法介绍和使用

1、属性

$("p").addClass(css中定义的样式类型); 给某个元素添加样式

常用于表格鼠标移动效果

$(document).ready(function(){
　　//"tr:ge(0)"tr标签索引大于零的就执行
　　$("tr:gt(0)").hover(function(){
　　$(this).addClass("moveover");
　　},function(){
　　　　$(this).removeClass("moveover");
　　});
});

$("img").attr({src:"test.jpg",alt:"test Image"}); 给某个元素添加属性/值，参数是map 
$("img").attr("src","test.jpg"); 给某个元素添加属性/值 
$("img").attr("title", function() { return this.src }); 给某个元素添加属性/值 
$("元素名称").html(); 获得该元素内的内容（元素，文本等） 
$("元素名称").html("<b>new stuff</b>"); 给某元素设置内容 
$("元素名称").removeAttr("属性名称") 给某元素删除指定的属性以及该属性的值 
$("元素名称").removeClass("class") 给某元素删除指定的样式

$("元素名称").text(); 获得该元素的文本 
$("元素名称").text(value); 设置该元素的文本值为value 
$("元素名称").toggleClass(class) 当元素存在参数中的样式的时候取消,如果不存在就设置此样式 
$("input元素名称").val(); 获取input元素的值 
$("input元素名称").val(value); 设置input元素的值为value

2、操作元素

$("元素名称").after(content); 在匹配元素后面添加内容 
$("元素名称").append(content); 将content作为元素的内容插入到该元素的后面 
$("元素名称").appendTo(content); 在content后接元素 
$("元素名称").before(content); 与after方法相反 
$("元素名称").clone(布尔表达式) 当布尔表达式为真时，克隆元素（无参时，当作true处理） 
$("元素名称").empty() 将该元素的内容设置为空 
$("元素名称").insertAfter(content); 将该元素插入到content之后 
$("元素名称").insertBefore(content); 将该元素插入到content之前 
$("元素").prepend(content);

将content作为该元素的一部分，放到该元素的最前面 
$("元素").prependTo(content); 将该元素作为content的一部分，放content的最前面 
$("元素").remove(); 删除所有的指定元素 
$("元素").remove("exp"); 删除所有含有exp的元素 
$("元素").wrap("html"); 用html来包围该元素 
$("元素").wrap(element); 用element来包围该元素

3、属性过滤选择器
$("div[id]") 匹配所有具有指定属性的元素 
$("input[name='newsletter']") 匹配所有具有指定属性值的元素 
$("input[name!='newsletter']") 匹配所有不具有指定属性值的元素 
$("input[name^='news']") 匹配所有指定属性值以value开头的元素 
$("input[name$='letter']") 匹配所有指定属性值以value结尾的元素 
$("input[name*='man']") 匹配所有指定属性值含有value字符的元素 
$("input[id][name$='man']") 匹配同时符合多个选择器的所有元素

4、子元素过滤选择器 
$("ul li:nth-child(2)"), 
$("ul li:nth-child(odd)"), 匹配父元素的第n个子元素 
$("ul li:nth-child(3n + 1)")

$("div span:first-child") 匹配父元素的第1个子元素 
$("div span:last-child") 匹配父元素的最后1个子元素 
$("div button:only-child") 匹配父元素的唯一1个子元素

5、表单元素选择器 
$(":input") 匹配所有的表单输入元素，包括所有类型的input, textarea, select 和 button 
$(":text") 匹配所有类型为text的input元素 
$(":password") 匹配所有类型为password的input元素 
$(":radio") 匹配所有类型为radio的input元素 
$(":checkbox") 匹配所有类型为checkbox的input元素 
$(":submit") 匹配所有类型为submit的input元素 
$(":image") 匹配所有类型为image的input元素 
$(":reset") 匹配所有类型为reset的input元素 
$(":button") 匹配所有类型为button的input元素 
$(":file") 匹配所有类型为file的input$(":hidden") 匹配所有类型为hidden的input元素或表单的隐藏域

$(document).ready(function(){
//标签选择器
$("button").click(function(){
alert("标签选择器_按钮");
});
//id选择器
$("#b1").click(function(){
alert("id选择器_按钮");
});
//类选择器
$(".class2").click(function(){
alert("类选择器_按钮");
});
//包含选择器
$("#b1,.class2").click(function(){
alert("包含选择器_按钮:格式=$(#b1,class2)");
});

6、表单元素过滤选择器 
$(":enabled") 匹配所有可操作的表单元素 
$(":disabled") 匹配所有不可操作的表单元素

$(":checked") 匹配所有已点选的元素

function  batchDelManager(isFormal){//拿到选中的复选框的value
        var checkCom = $("input[name=checkCom]:checked");
        var optCom = "";
        for(var i = 0; i < checkCom.size(); i++){
                optCom += checkCom[i].value + ":";
        }

$("input[name$='checkCom']").each(function () { this.checked = true; });//name名字为checkCom的复选框全部选中

$(":checkbox").val(["cc3","cc2","cc4"]);//设置复选框中value值为多少的选中，

$("select option:selected") 匹配所有已选择的元素

的Option(第一个) 
$("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option 
$("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option

7、其他

$(document).ready(function(){
//toggle开关的方法
$("input").toggle(function(){
$("div").show(5000);//全部显示的时间长度为5秒，不带参数则没有延时效果
},function(){
$("div").hide(5000);//全部隐藏的时间长度为5秒
});
});

$("#元素id").html("指定位置要添加的HTMLTest");

$("<option value='"1"'>"+IT部+"</option>").appendTo($("#元素id"));//指定在那个下拉列表添加一个下拉选项

$(":checkbox:checked").each(function(){

　　alert($(this).val());//遍历所有复选框

}