JQ 도구 함수 활용

40226 단어 함수.
1. 대상 을 문자열 로 변환
 
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <script src="../Scripts/jquery-1.9.1.js"></script>

    <script type="text/javascript">

        $(function () {

            $("button").click(function () {

                var option = {

                    user: "wangqiang",

                    pass:"123456789"

                }

                var str = jQuery.param(option);

                $("#result").text(str);

            })

        })

    </script>

    <title></title>

</head>

<body>

    <button>        </button>

    <div id="result"></div>

</body>

</html>

2. 문자열 처리 (공백 제거)
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <script src="../Scripts/jquery-1.9.1.js"></script>

    <script type="text/javascript">

        $(function () {

            $("button").click(function () {

                var str = "    ";

                alert(str.length);

                str = jQuery.trim(str)

                alert(str.length);                                  

            })



        })

    </script>

    <title></title>

</head>

<body>

    <div>



      <button>      </button>

    </div>

</body>

</html>

3. 배열 과 집합 을 교체 한다.
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <script src="../Scripts/jquery-1.9.1.js"></script>

    <script type="text/javascript">

        $(function () {

            var a = [

                    { width: 400 },

            { height: 300 }

            ];

            jQuery.each(a,function(name,value)

            {

                if (name > 0) return false;//               each  ,    false    

                alert(name+="="+value);

            })



        })

    </script>

    <title></title>

</head>

<body>



</body>

</html>

4. 배열 을 선별한다
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <script src="../Scripts/jquery-1.9.1.js"></script>

    <script type="text/javascript">

        //    

        var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];

        arr = jQuery.grep(arr, function (value, index) {

            return value >= 5;

        })

        alert(arr);

        //    

        var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];

        arr = jQuery.map(arr, function (elem) {

            return elem * 2 > 5 ? elem * 2 : null;

        })

        alert(arr);

        //    

        var arr1 = [1, 2, 3, ["a", "b", "c"]];

        var arr2 = [4, 5, 6, [7, 8, 9]];

        arr3 = jQuery.merge(arr1, arr2);

        alert(arr1);

        alert(arr1.length);//

        alert(arr3);

        alert(arr3.length);

    </script>

    <title></title>

</head>

<body>



</body>

</html>

5. 사용자 에이전트 검사
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <script src="../Scripts/jquery-1.4.1.js"></script>

    <script type="text/javascript">

        $(function () {

            var brower = $.browser;

            var temp = "";

            for (var name in brower)

            {

                if (brower[name] == true) {

                    temp += name + "=" + brower[name] + "" + name;

                }

                else {



                    temp += name + "=" + brower[name];

                }

            }

            $("div").html(temp);

        })

    </script>

    <title></title>

</head>

<body>

    <div></div>

</body>

</html>

6. 배열 형식 인지 판단
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <script src="../Scripts/jquery-1.9.1.js"></script>

    <script type="text/javascript">

        $(function () {

            var a = [

                    {width:400},

            {height:300}

            ];

            if (jQuery.isArray(a))

                alert("  a   ");

                

        })

    </script>

    <title></title>

</head>

<body>



</body>

</html>

7. 배열 생 성
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <script src="../Scripts/jquery-1.9.1.js"></script>

    <script type="text/javascript">

        var arr = jQuery.makeArray($("li").val);

        alert(arr);

        $("ul").html(arr.reverse());



    </script>

    <title></title>

    <style type="text/css"></style>

</head>

<body>

    <ul>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>6</li>

        <li>7</li>

        <li>8</li>

    </ul>

</body>

</html>

좋은 웹페이지 즐겨찾기