• 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"});

  • 相关阅读:
    Windows激活客户端 已停止工作
    sevices.msc灰色处理办法
    日期求星期(java)蓝桥杯
    全排列筛选(java)
    日期类的使用(java)蓝桥杯
    蓝桥杯加法变乘法(java)
    搭积木(java)蓝桥杯
    Ftp commands and options
    随机long(Random long/NextLong)
    Windows Azure Storage Explorer List
  • 原文地址:https://www.cnblogs.com/ken-admin/p/6405770.html
Copyright © 2020-2023  润新知