• 仿jQuery css 函数自定义可过滤合法属性的mycss函数


    canrun

    应一个朋友的需求,仿照jQuery的css函数自定义了mycss函数,该函数能过滤合法css属性。源码如下:

    View Code
     1 <html>
     2 <head>
     3     <title>jQuery mycss</title>
     4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5     <meta http-equiv="Content-Language" content="zh-CN" />
     6     <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
     7     <!--<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.js"></script>-->
     8 </head>
     9 <body>
    10 <script type="text/javascript">
    11 $(document).ready(function(){    
    12     jQuery.extend({
    13         //mycss 函数合法属性
    14         mycssAccess : false
    15     });
    16     jQuery.fn.extend({
    17         //仿了jquery-1.8.0.js中的css: function( name, value )
    18         mycss: function( name, value ) {
    19             //自定义过滤处理
    20             var access = (typeof(jQuery.mycssAccess) == 'object')?jQuery.mycssAccess:[];
    21             // css("height",2000) 的情况
    22             if(typeof(name) != 'object' && !access.in_array(name)) return false;
    23             // css({"height":200,"width":300}) 的情况
    24             else {
    25                 $.each(name,function(n,val){
    26                     //非法则注销该变量
    27                     if(!access.in_array(n)) name[n] = null;
    28                 })
    29             }
    30             
    31             
    32             return jQuery.access( this, function( elem, name, value ) {
    33                 return value !== undefined ?
    34                     jQuery.style( elem, name, value ) :
    35                     jQuery.css( elem, name );
    36             }, name, value, arguments.length > 1 );
    37         }
    38     });
    39     //定义in_array函数
    40     Array.prototype.S=String.fromCharCode(2);
    41     Array.prototype.in_array=function(e) {
    42         var r=new RegExp(this.S+e+this.S);
    43         return (r.test(this.S+this.join(this.S)+this.S));
    44     }
    45     
    46     //mycss函数测试
    47     jQuery.mycssAccess = ["height","display","background-color"];
    48     //下面的width,float属性将被过滤掉
    49     $("#abc").mycss({"height":200,"width":300,"background-color":"#ABC","float":"left","display":"block"});
    50 });
    51 </script>
    52 <div id="abc">abc</div>
    53 </body>
    54 </html>

    其中引用了一个《判断js数组包是否包含某个元素》的in_array函数,它的功能类似php的in_array函数,挺不错的,嘿嘿~

    作者:Zjmainstay
             
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
    版权信息
  • 相关阅读:
    centos8.2安装Rabbitmq-3.8.12
    绝对好文C#调用C++DLL传递结构体数组的终极解决方案
    c++到c#数据类型的转换
    WPF中timer的使用
    接收Dialog的值
    WPF子界面向父界面传递带参数的委托
    2015上海居住证和积分办理流程
    Discuz! X3.2重置管理员账号
    winServer2008下安装SqlServer2008数据库
    jodd cache实现缓存超时
  • 原文地址:https://www.cnblogs.com/Zjmainstay/p/jQuery_fn_mycss.html
Copyright © 2020-2023  润新知