jQuery应用的几个主要函数

1. 清空元素

      empty();         //内容删除,但元素还存在

$(document).ready(function(){
                //触发onclick事件
                $("#testbutton").click(
                    function(){
                        $("p#second").empty();      //删除子节点
                    }
                );
    }); 

2.删除元素

     remove([expr]);       //元素和内容都删除

$(document).ready(function(){
                //触发onclick事件
                $("#testbutton").click(
                    function(){
                        $("p#second").remove();     //删除匹配元素
                    }
                );
    });

或:

$(document).ready(function(){
                //触发onclick事件
                $("#testbutton").click(
                    function(){
                        $("p").remove("#second");
                    }
                );
    });

3. 获得父元素

        parent( [expr] );     //获得唯一父元素的元素集合

<div><p>Hello</p><p>Hello</p></div> 
//查找每个段落的父元素
$("p").parent() ;

[ <div><p>Hello</p><p>Hello</p></div>] 


<div><p>Hello</p></div><div class="selected"><p>Hello Again</p></div> 
//查找段落的父元素中每个类名为selected的父元素。 
$("p").parent(".selected") ;

[ <div class="selected"><p>Hello Again</p></div> ] 

        parents( [expr] );     //取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)

<html><body><div><p><span>Hello</span></p><span>Hello Again</span></div></body></html> 
//找到每个span元素的所有祖先元素。 
$("span").parents() ;
//找到每个span的所有是p元素的祖先元素。
$("span").parents("p") ;

     parentsUntil( [expr] );      //查找当前元素的所有的父辈元素,直到遇到匹配的那个元素为止。

<ul class="level-1">
    <li class="item-i">I</li>
    <li class="item-ii">II
      <ul class="level-2">
        <li class="item-a">A</li>
        <li class="item-b">B
          <ul class="level-3">
            <li class="item-1">1</li>
            <li class="item-2">2</li>
            <li class="item-3">3</li>
          </ul>        
        </li>        
        <li class="item-c">C</li>
      </ul>
    </li>
    <li class="item-iii">III</li>
  </ul>

//查找item-a的祖先,但不包括level-1
$('li.item-a').parentsUntil('.level-1')      
.css('background-color', 'red');

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值