【知识储备】 jquery 小总结

因为项目需要和李哲兄最近在做这个专题，最近在学习jquery，总结一下基础东西

1.DOM方式

  $('#lihan')
  //返回id为lihan的TAG,类型:jQuery对象
  $('#lihan p')
  $('#lihan>p')
  //返回id为lihan的TAG下所有的p
 比如：$("#lihan").addClass("red")
 //为id为lihan的tag加上css为red名字的属性
 $('#lihan1 #lihan2 #lihan3') 和 $('#lihan1,#lihan2,#lihan3') 的区别

  $('#lihan1 #lihan2 #lihan3')
  //返回id为#lihan1下的#lihan2下的#lihan3的TAG

$('#lihan1,#lihan2,#lihan3')
  //返回id为lihan1,lihan2,lihan3的TAG的群组

DOM对象与jquery对象转换也是很好的，如：
$("#lihan").html();
$("#lihan")[0].innerHTML;
$("#lihan").eq(0)[0].innerHTML;
$("#lihan").get(0).innerHTML;
上面的几种写法都是一样的

这是为表单提供的一些选择器：

:input 选择表单元素（input, select, textarea, button） 
:text 选择所有文本域(type="text") 
:password 选择所有密码域(type="password"). 
:radio 选择所有单选按钮(type="radio"). 
:checkbox 选择所有复选框(type="checkbox"). 
:submit 选择所有提交按钮(type="submit"). 
:image 选择所有图像域 (type="image"). 
:reset 选择所有清除域(type="reset"). 
:button 选择所有按钮(type="button"). 
同样也可以使用:hidden，详细说明上面已经介绍过。

$('#myForm :input')

如果你需要指定表单：

$('input:radio', myForm)

这将选择myForm表单中所有单选按钮。选择radio通常是用[@type=radio]

取得name值为lihan的输入字段的值：

$("input[@name=lihan]").val();

所有处于选中状态的单选r按钮：

$("input[@type=radio][@checked]")

 

2.CSS方式
  
  $('.style')
  //返回样式为style的TAG

  $('div.style')
  //返回样式为style的div

  $('.style1,.style2,.style3')
  //返回样式为style1,style2,style3的群组

 一般为DOM对象添加css样式时候用addClass
 比如：$("#lihan").addClass("red")

操作元素的css
主要包括以下几种方式：
$("#lihan").css("background");    //返回元素的背景颜色
$("#lihan").css("background","#ccc") //设定元素背景为灰色
$("#lihan").height(300); $("#msg").width("200"); //设定宽高
$("#lihan").css({ color: "red", background: "blue" });//以名值对的形式设定样式
$("#lihan").addClass("select"); //为元素增加名称为select的class
$("#lihan").removeClass("select"); //删除元素名称为select的class
$("#lihan").toggleClass("select"); //如果存在（不存在）就删除（添加）名称为select的class

3.属性方式
  
  $('[attribute]')
  //返回所有拥有attribute属性的所有tag
  
  $('[attribute=value]')//返回属性attribute值为value的所有tag
  $('[attribute!=value]')//返回属性attribute值不为value的所有tag
  $('[attribute^=value]')//返回属性attribute值以value开头的所有tag
  $('[attribute$=value]')//返回属性attribute值以value结尾的所有tag
  $('[attribute*=value]')//返回属性attribute值包含value的所有tag

  还可有群组选择
  $('[attribute1=value1],[attribute2=value2],[attribute3=value3]')

转载自: http://blog.csdn.net/lihan6415151528/article/details/3889536(衷心感谢lihan6415151528 )