jquery选择器,文档处理,属性

原创 2012年03月25日 15:33:44

子元素选择器:  $('ul li:last-child')

     first-child:  ':first' 只匹配一个元素,而此选择符将为每个父元素匹配一个子元素 

     last-child:  ':last'只匹配一个元素,而此选择符将为每个父元素匹配一个子元素

     only-child:  如果某个元素是父元素中唯一的子元素,那将会被匹配    如果父元素中含有其他元素,那将不会被匹配。

     nth-child:    匹配其父元素下的第N个子或奇偶元素  ':eq(index)' 只匹配一个元素,而这个将为每一个父元素匹配子元素。:nth-child从1开始的,而:eq()是从0算起的!


      :nth-child(even)   :nth-child(2n)        匹配父元素下面的所有偶元素
      :nth-child(odd)    :nth-child(2n+1)    匹配父元素下面的所有奇元素
      :nth-child(3n)       匹配父元素下面的为3的倍数的元素
      :nth-child(2)         匹配父元素下面指定的元素
     

表单选择器:

      input:表单类型 (text,button,checkbox,radio,reset,file等)     

      input:button  返回所有的input  类型为button的元素集合


表单对象属性选择器:

      input:enabled  ,  disabled,   checked,   selected


jquery的文档处理


    1、内部插入节点:把一个新的节点插入另一个元素内部的结尾处
       内插分为:
            1)、插入到之前 append(插入到内部结尾)  父节点.append(要插入的节点)
            2)、把某个子节点追加到父节点中 appendTO  要插入的节点.appendTo(父节点)
            3)、插入到父节点内部第一个 :父节点.prepend (要插入的节点)
            4)、插入到某个之前:prependTo  子节点.prependTo(父节点)
            
    
    2、外部插入节点:把一个新的节点插入另一个元素的之前或者之后
        在某个同级节点前后插入
            1)、在某个匹配元素之后插入新的元素  匹配元素.after(要插入元素)
            2)、在某个匹配元素之前插入新的元素  匹配元素.before(要插入元素)
            3)、insertAfter:  待插入的元素.insertAfter(匹配元素)
            4)、insertBefore:  待插入的元素.insertBefore(匹配元素)

    
    3、创建节点:

        1)、$() 创建(可直接加属性和文本节点)   $("<a id='id1'>我也可以被创建</a>");
        
    4、删除节点:
        1)、remove()  真删除
        2)、empty()  伪删除  还存在
        
    5、复制节点: 克隆匹配的DOM元素并且选中这些克隆的副本。
在想把DOM文档中元素的副本添加到其他位置时这个函数非常有用。
        
        1)、clone  克隆后不具有任何行为事件
        2)、clone(ture) 克隆后有行为事件
        
    6、替换
        1)、replaceWith  将所有匹配的元素替换成指定的HTML或DOM元素。     
        匹配元素$("li").replaceWith("<a href=#>我被替换了!</a>");
        2)、replaceAll  用匹配的元素替换掉所有 selector匹配到的元素
        $("<a href=#>我被替换回来了!</a>").replaceWith("li匹配元素");
        

    7、包裹  

                1、wrap(html)把所有匹配的元素用其他元素的结构化标记包裹起来。

                2、wrapAll(html)将所有匹配的元素用单个元素包裹起来这于 '.wrap()' 是不同的,'.wrap()'为每一个匹配的元素都包裹一次。

                3、 wrapInner(elem)      将每一个匹配的元素的子内容(包括文本节点)用DOM元素包裹起来

   
属性:
        1、获取属性值:
        attr(name);
            注意:attr()获取的是第一个匹配的值,不会获取一个集合
                    <div id=2></div>
                用法:attr('属性名');  得到属性值
                
        2、一次设置一个属性
        attr(name,value)
        
        3、一次设置多个属性
        attr({name:value,name:value})
        
        4、函数设置属性:
        attr(name,function)
        $("img").attr("title", function() { return this.src });
        
        5、移除属性
        removeAttr(name)        
        
        
        
css:   用法和属性相似
        1、获取属性值:
        css(name);
            注意:attr()获取的是第一个匹配的值,不会获取一个集合
                    <div id=2></div>
                用法:attr('属性名');  得到属性值
                
        2、一次设置一个属性
        css(name,value)
        
        3、一次设置多个属性
        css({name:value,name:value})
        
        注意:如果属性名包含 "-"的话,必须使用引号:  例如:margin-left
      
        addClass();     给元素添加class属性
        removeClass();  删除元素的属性
        toggleClass();  切换样式 有变无,无变有。
版权声明:本文为博主原创文章,未经博主允许不得转载。

jQuery--文档处理

文档处理 1、内部插入 A.append(B) 将B插入到A的内部后面(之后的串联操作,操作A)                      ....                     ...
  • CSDN_GIA
  • CSDN_GIA
  • 2017年02月02日 17:04
  • 689

jquery文档处理(增、删、改、查))

1. 插入  append(content) :将content内容插入到匹配元素内容的最后  prepend(content) :将content内容插入到匹配元素内容的最前 内容...
  • ynw1990
  • ynw1990
  • 2016年09月05日 17:44
  • 624

jQuery过滤选择器——属性过滤选择器

属性过滤选择器属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素 1、[attribute] 用法: $(”div[id]“) ; 返回值:集合元素 说明: 匹配包含给...
  • cckevincyh
  • cckevincyh
  • 2016年11月13日 20:55
  • 983

jQuery 层次选择器,属性选择器

jQuery层次选择器 jquery属性选择器 jq根据是否有某属性选择 jq选取子元素、后边的元素等 $("div >span") $("#one +div") $("#one~div")...
  • tangdou5682
  • tangdou5682
  • 2016年12月01日 10:40
  • 643

jQuery 选择器属性大全

本文章有可行性研究报告编写技术部门推荐,欢迎阅读使用。 选择器 实例 选取 * $("*") 所有元素 ...
  • kaixinjiuhao01
  • kaixinjiuhao01
  • 2013年03月06日 10:25
  • 464

jQuery的文档处理 --内部处理

Untitled Document //测试使用 jQuery 创建节点并插入节点到指定的节点中 /* 1. 创建节点: 使用 $(html) 方式即可, ...
  • tyutjavalily
  • tyutjavalily
  • 2015年08月14日 14:00
  • 153

jQuery的ID选择器

基本选择器在实际应用中比较广泛,建议重点掌握jQuery的基本选择器,它是其他类型选择器的基础,基础选择器是jQuery选择器中最为重要的部分。 jQuery基本选择器包括ID选择器、元素选择器、类...
  • chengqiuming
  • chengqiuming
  • 2017年04月12日 10:51
  • 622

JQuery学习之jQuery九类选择器,属性,CSS和文档处理

jQuery九类选择器, 属性, CSS 文档处理
  • Java_jfei
  • Java_jfei
  • 2017年02月22日 18:12
  • 139

jQuery的name选择器 模糊匹配

$("div[id]") 选择所有含有id属性的div元素  $("input[name='keleyicom']") 选择所有的name属性等于'keleyicom'的input元素  $(...
  • einsdan
  • einsdan
  • 2014年09月24日 17:38
  • 12842

JQuery选择器之[attribute^=value]使用注意事项

Firefox下JQuery选择器之[attribute^=value]使用注意事项之前写的一个脚本中用到了var bindAttrs = $("[databind^='attr'", item);大...
  • testcs_dn
  • testcs_dn
  • 2014年10月13日 17:06
  • 3670
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jquery选择器,文档处理,属性
举报原因:
原因补充:

(最多只允许输入30个字)