首页 > 代码库 > JQ工具函数运用

JQ工具函数运用

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>

 

JQ工具函数运用