JQuery常用内容(更新中)

来源:互联网 发布:云计算 视界云 知乎 编辑:程序博客网 时间:2024/06/03 21:27
dom和jquery的相互 转换#dom->jquery$(dom)#jquery->dom$jquery.get(0)选择第一个div元素 $("div:first")选择最后一个div元素 $("div:last")选择class不为one的所有div元素 $("div:not('.one')")选择索引值为偶数的div元素 $("div:even")选择索引值为奇数 的div元素 $("div:odd")选择索引值等于3的元素 $(div:eq(3))选择索引值大于3的元素 $(div:gt(3))选择索引值小于3的元素 $("div:lt(3)")选择所有的标题元素 $(":header") 选择当前正在执行动画的所有元素 $(":animated")选取含有文本“di”的div元素 $("div:contains('di')")选取含有class为mini元素 的div元素 $("div:has(.class)")选取不包含子元素(或者文本元素)的div空元素 $("div:empty")选取含有子元素(或者文本元素)的div元素 $("div:parent")选取所有可见的div元素 $("div:visible")选取所有不可见的元素 $("div:hidden")选取所有的文本隐藏域, 并打印它们的值$("input:hidden").each(function(){                alert($(this).val());            });选取含有 属性title 的div元素 $("div[title]")选取 属性title值等于“test”的div元素 $("div[title='test']")选取 属性title值不等于“test”的div元素(没有属性title的也将被选中)  $("div[title!='test']")选取 属性title值 以“te”开始 的div元素 $("div[title^='te']")选取 属性title值 以“est”结束 的div元素 $("div[title$='te']")选取 属性title值 含有“es”的div元素 $("div[title*='te']")组合属性选择器,首先选取有属性id的div元素,然后在结果中 选取属性title值 含有“es”的元素 $("div[id][title*='es']")$("input[type='text']").on("focus blur",function(){    var dv=$(this).attr("defaultValue");    if($(this).is(":focus")){        $(this).val(dv);    }})选取每个class为one的div父元素下的第2个子元素$("div[class='one'] :nth-child(2)")$("div.one:nth-child(2)")选取每个class为one的div父元素下的第一个子元素$("div.one :first-child")选取每个class为one的div父元素下的最后一个子元素$("div.one :last-child")如果class为one的div父元素下的仅仅只有一个子元素,那么选中这个子元素$("div.one :only-child")对表单内 可用input 赋值操作$("input:enabled")对表单内 不可用input 赋值操作$("input:disabled")获取多选框选中的个数alert($("[name='newsletter']:checked").length);获取下拉框选中的内容$(":selected").each(function(){    $("#selectDivId").append($(this).val()   );});显示隐藏$(document).ready(function(){    var $allLi=$("li:gt(4):not(:last)");    $allLi.hide();    $("span").click(function(){        if($allLi.is(":hidden")){            $allLi.show();            $(this).html("影藏");        }else{            $allLi.hide();            $(this).html("显示");        }    });});html(...) 设置html代码,如果有标签,将进行解析。text(...) 设置文本值,如果有标签,将被转义  -->   <  &lt;   &  &amp;  >  &lt;    &nbsp;A.append(B)  将B插入到A的内部后面(之后的串联操作,操作A)    <A>        ....        <B></B>    <A>A.prepend(B) 将B插入到A的内部前面    <A>        <B></B>        ....    <A>--------------------------------------------A.appendTo(B) 将A插入到B的内部后面 (之后的串联操作,操作A)A.prependTo(B) 将A插入到B的内部前面--------------------------------------------A.after(B)  , 将B插入到A后面(同级)    <A></A>    <B></B>A.before(B) ,将B插入到A前面    <B></B>    <A></A>-----------------------------------A.insertAfter(B) , 将A插入到B后面(同级)    <B></B>    <A></A>A.insertBefore(B) 将A插入到B前面    <A></A>    <B></B>empty()  清空标签体remove() 删除当前对象。如果之后再使用,元素本身保留,绑定事件 或 绑定数据 都会被移除detach() 删除当前对象。如果之后再使用,元素本身保留,绑定事件 或 绑定数据 都保留绑定数据data(name) 获得data(name,value) 设置A.replaceWith(B) ,使用A将B替换掉A.replaceAll(B) ,使用B将A替换掉A.wrap(B) ,使用B将每一个A进行包裹(多个B)<B><A></A></B><B><A></A></B>A.wrapAll(B) ,使用B将所有A进行包裹(一个B)<B>    <A></A>    <A></A></B>A.add(B)  将A和B组合一个对象 。类型 $("A,B")andSelf() : 将之前对象添加到操作集合中    A.children().andSelf()      A   孩子    孩子和Aend() :回到最近的一个"破坏性"操作之前    A.children().children().end() .end()      A   孩子   孙子     孩子  A<A>    <B>        <C></C>        <D></D>        <E></E>        <F></F>    </B></A>B.children([...])   获得所有的子元素。CDEFA.find(D)  从指定的区域查询指定元素。DD.next()    下一个兄弟。ED.nextAll() 后面的所有兄弟。EFE.prev()    上一个兄弟。D  (previous)E.prevAll()  前面的所有兄弟。CDE.siblings()    所有兄弟。CDFE.parent()  父元素。BE.closest(A)  向上获得指定的父元素(含自己),如果获得返回一个对象,如果没有没有对象。------------------------------C.nextUntil(E)  获得后面所有兄弟,直到指定条件位置。DEF.prevUntil(D)  获得前面所有兄弟,直到指定条件位置。DEE.parents()   获得所有的父元素。AB文本选中的内容:$("#e01").select(function(event){    //支持谷歌    var sub = $(this).val().substring(event.target.selectionStart,event.target.selectionEnd);    $("#textMsg").html("文本内容被选中:select , " + sub);});1只能点击一次,之后失效$("#h01").one("click",function(){    alert("--");});点击:先弹出+++再弹出---$("#h02").bind("click.a",function(){    alert("++++"););$("#h02").bind("click.b",function(){    alert("---");}
原创粉丝点击