1. 程式人生 > >jquery 迴圈each簡單例項 和 parent 查詢父元素的例項

jquery 迴圈each簡單例項 和 parent 查詢父元素的例項

下面的方法是隱藏 :src屬性為"wenbin.jpg" 的元素

$(function ()
    {
                $("img").each(function ()
                {
                    if (($(this).attr("src")) == "wenbin.jpg")
                    {
                        $(this).hide();
                    }
                });
    });


下面的程式碼是隱藏:id為jy的元素的父元素

 $("#jy").parent().css("display", "none");
或者$("#jy").parent().hide();//這行程式碼我沒測試,自己忽然間想到的

通過上面來總結一下jquery中的用法,我所看到的只要是用在$("#id")或者是其他jquery選擇器,後面跟著的都是方法,即都是帶括號的函式。

jquery each用法

 $(function()
    {
        var arr1 = ["aaa", "bbb", "ccc"];
        $(arr1).each(function(id, val)
        {
            alert(id);
            alert(val);
        });
    });

也可以使用下面的這種方法

 var arr1 = [ "aaa", "bbb", "ccc" ];      
  $.each(arr1, function(i,val){      
      alert(i);   
      alert(val);
  });   


個人比較喜好第一種方法,因為跟其他的用法都是差不多的,都是$("元素id或者class等”).each(function(id,val){......});

each可以接帶引數的function也可以接不帶引數的function,如下是不帶引數的function

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script src="js/jquery.min.js" type="text/javascript"></script>
<a href="http://www.baidu.com">百度</a>
<a href="http//www.google.com.cn">谷歌</a>
<a href="http://www.yahoo.com">雅虎</a>
</head>
<body>
</body>

<script type="text/javascript">
    $(function()
    {
        $("a").each(function()
        {
            alert($(this).attr("href"));
            alert($(this).text());
        });
    });
</script>

</html>