zoukankan      html  css  js  c++  java
  • Js控制样式的诸多方法

    function TableCss(options){

    //如果没参数,就退出

            if(arguments.length < 1 || !document.getElementById(options.tableName) ) { return ;}

    //参数及默认参数

            var options = {

                    tableName : options.tableName,

                    evenClass : options.evenClass || "tr_even",

                    oddClass   : options.oddClass || "tr_odd",

                    clickClass  : options.clickClass || "tr_click",

                    hoverClass: options.hoverClass || "tr_hover"

                    }

    //根据ID找到表格元素

            var tableName = document.getElementById(options.tableName);

            var tr = tableName.getElementsByTagName("tr");

    //对TR元素循环设置

            for(var i=0, len=tr.length; i<len; i++){

    //用了闭包

                    (function(k){

                            //设置奇偶行样式          

                            tr[k].className = (k%2==0)? options.oddClass : options.evenClass;

    //点击样式

                            tr[k].onclick = function(){

                                    if (tr[k].className == options.clickClass){

                                            tr[k].className = (k%2==0)? options.oddClass : options.evenClass;

                                    }

                                    else {

                                            tr[k].className = options.clickClass;

                                    }

                            }

                            //鼠标HOVER样式,如果已经是点击样式,则不变化

                            tr[k].onmouseover = function(){

                                    if(tr[k].className == options.clickClass ){ return false;}

                                    else { tr[k].className = options.hoverClass;}

                            }

                            tr[k].onmouseout = function(){  

                                    if(tr[k].className == options.clickClass){ return false;}

                                    else {  

    tr[k].className = (k%2==0)? options.oddClass : options.evenClass;

    }

                            }

                            

                            

                     })(i)

            }

    }

    //调用

    TableCss({tableName:"tb1"});

  • 相关阅读:
    linux使用secureCRT连接(没有rsa的时候)
    linux删除某个php程序进程的组合命令
    Redis介绍以及安装(Linux)
    PHP Warning: date() [function.date]: It is not safe to rely on the system's timezone
    linux下生成rsa密钥的方法
    mysql 的 infobright 数据库的 mediumblob 显示不了数据
    PHP中的Libevent学习
    PHP函数getopt详解
    php_sapi_name详解
    PHP使用mysqldump备份数据库(以及还原)
  • 原文地址:https://www.cnblogs.com/ken-admin/p/6405770.html
Copyright © 2011-2022 走看看