Jquery工具一览

最新推荐文章于 2024-05-05 01:18:59 发布

Byte_Dance

最新推荐文章于 2024-05-05 01:18:59 发布

阅读量245

点赞数

分类专栏： Jquery

Jquery 专栏收录该内容

44 篇文章 0 订阅

订阅专栏

浏览器以及特性检测
$.support jQuery 1.3 新增。一组用于展示不同浏览器各自特性和bug的属性集合。

jQuery.support.boxModel(参数有:boxModel . cssFloat . hrefNormalized ......)

$.browser 浏览器内核标识。依据 navigator.userAgent 判断。
$.browser.version 在jQuery 1.3中不建议使用。浏览器渲染引擎版本号。

典型结果: Internet Explorer: 6.0, 7.0

$.boxModel 在jQuery 1.3中不建议使用。当前页面中浏览器是否使用标准盒模型渲染页面。

建议使用 jQuery.support.boxModel 代替。W3C CSS 盒模型.

数组和对象操作
$.each(object, [callback]) 通用例遍方法，可用于例遍对象和数组。
$.extend([d],tgt,obj1,[objN]) 用一个或多个其他对象来扩展一个对象，返回被扩展的对象。
合并 settings 和 options，修改并返回 settings。
jQuery 代码:
var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
jQuery.extend(settings, options);
结果:
settings == { validate: true, limit: 5, name: "bar" }
$.grep(array, fn, [invert]) 使用过滤函数过滤数组元素。
$.makeArray(obj) 将类数组对象转换为数组对象。
$.map(array, callback) 将一个数组中的元素转换到另一个数组中。
$.inArray(value, array) 确定第一个参数在数组中的位置，从0开始计数(如果没有找到则返回 -1 )。
$.toArray() 把jQuery集合中所有DOM元素恢复成一个数组。
$.merge(first, second) 合并两个数组
$.unique(array) 删除数组中重复元素。只处理删除DOM元素数组，
                                                                      而不能处理字符串或者数字数组。
$.parseJSON(json) 接受一个JSON字符串，返回解析后的对象。
函数操作
             $.noop 一个空函数当你仅仅想要传递一个空函数的时候，就用他吧。
              $.proxy(function, scope) 返回一个新函数，并且这个函数始终保持了特定的作用域。
测试操作
$.contains(container, contained) 一个DOM节点是否包含另一个DOM节点。
$.isArray(obj) 测试对象是否为数组。
$.isFunction(obj) 测试对象是否为函数。
$.isEmptyObject(obj) 测试对象是否是空对象（不包含任何属性）。
$.isPlainObject(obj) 测试对象是否是纯粹的对象（通过 "{}" 或者 "new Object" 创建的）。
$.isWindow(obj) 用于测试是否为窗口的对象
$.type(obj) 用于测试类型的对象
字符串操作
$.trim(str) 去掉字符串起始和结尾的空格。
URL
$.param(obj, [traditional]) 将表单元素数组或者对象序列化。是.serialize()的核心方法。
插件编写
$.error(message) 接受一个字符串，并且直接抛出一个包含这个字符串的异常。

原生JS获取属性

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>原生JS获取元素属性</title>

</head>
<body>
<div id="divid" name="divname"></div>
    <script>
        obj = [1,2,3,4,5,6];
//        obj2 = document.getElementById("divid");

        arr = [];
        j = 0;
        //循环获取元素属性
        for(i in obj){
            arr[j] = i;
            j++;
        }
        alert(arr);
    </script>
</body>
</html>

把表单输入的内容转换为URL

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>把表单输入的内容转换为URL</title>
    <!--百度在线压缩地址-->
    <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<!--这里是把表单直接提交到javascript上-->
<form action="">
    <p>用户名:</p>
    <p><input type="text" id="username"></p>
    <p>密码:</p>
    <p><input type="text" id="password"></p>
    <p><input type="button" value="提交"></p>
</form>


</body>
<script>
    //这里是处理JSON对象 把JSON对象转换为URL,方便Ajax使用,因为Ajax并不刷新,不提交
    obj = {"name":"username","password":"123456"};
    //    str = $.param(obj);
    //    alert(str);


    $(document).ready(function(){
        $(":button").click(function(){
            alert($("form").serialize());
        });
    });
</script>
</html>

表单输入框空格操作

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单判断输入是否为空格</title>
    <!--百度在线压缩地址-->
    <script src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script>
</head>
<body>
<!--禁止输入空格的正则表达式-->
<input type="text" οnkeyup="this.value=this.value.replace(/^ +| +$/g,'')">
<input type="text" id="inputid">

<button>检测</button>
<script>

    //表单名称字段 ,有可能存入空格
    str = "           ss ";
    //这个时候如果我们不去除空格就存进去了,那么就很容易造成错误
    alert($.trim(str).length);

    //去除空格有两种方式
//    $.trim($("#inputid").val());


    $("button").click(function(){
        //  trim() 函数是Jquery中用来去除字符串两边的空格,中间的没办法去掉
        //发现 直接判断 输入元素的 val(),来进行限制可以直接去掉空格.但是却输入一个字符后跟上一个空格却没办法限制,这违背了我们限制输入空格的初衷,所以不应该使用这种方式
        // 而加上length就去不掉了,空格也占位,这个时候就要用到trim()了
        v = $("#inputid").val();

//        if($("#inputid").val().trim().length < 1){
//            alert("请输入内容");
//        }else{
            alert("输入完成");
//            alert($.trim(v).length);
//        }
//        alert($("#inputid").val().length);
    });
</script>
</body>
</html>

Byte_Dance

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Jquery工具一览

浏览器以及特性检测 $.support jQuery 1.3 新增。一组用于展示不同浏览器各自特性和bug的属性集合。 jQuery.support.boxModel(参数有:boxModel . cssFloat . ...
复制链接

扫一扫