黑马程序员技术交流社区

标题: javascript中变量声明的问题！ [打印本页]
作者: 王睿    时间: 2012-2-19 15:32
标题: javascript中变量声明的问题！
本帖最后由 王睿 于 2012-2-20 02:50 编辑
  1. var name;
  2. function trcolor()
  3. {
  4.         var tabNode = document.getElementsByTagName("table")[0];
  5.         var trs = tabNode.rows;
  6.         for(var x = 1; x<trs.length-1; x++)
  7.         {
  8.                 if(x%2==1)
  9.                         trs[x].className = "one";
  10.                 else
  11.                         trs[x].className = "two";
  12.                 trs[x].onmouseover = function ()
  13.                 {
  14.                         name = this.className;
  15.                         this.className = "over";        
  16.                 };
  17.                 trs[x].onmouseout = function()
  18.                 {
  19.                         this.className = name;        
  20.                 };
  21.         }
  22.         
  23. }
  24. window.onload = trcolor;

复制代码
这段代码中开头不声明var name 也能实现效果（ie8），那声明和不声明有什么区别吗？
作者: 丁晓宇    时间: 2012-2-19 16:04
声明在外面就是全局的，js是弱语言，很弱很弱。
作者: 左华清    时间: 2012-2-19 20:32
从你的代码看,是要实现隔行变色是吧

1.首先,你var tabNode = document.getElementsByTagName("table")获得所有的表对象
2.但在取行的时候,你那样是取不到行对象的.
3.id,name,标签都不是

所以你这个代码不能实现,不只是因为变量声明在哪的问题,
当然,要声明肯定是在trcolor()函数里面,下面的代码有不如意的地方,
欢迎指出.你用的是通过直接操作css样式,和你的代码稍微有点不同.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script src="../js/jquery.js" type="text/javascript"></script>
    <script type="text/javascript">
        /**
            js版隔行变色
        */
        function changeColor() {
            var tableMain = document.getElementById("talbeMain");//通过id获得表格对象
            if (tableMain != null) {
                var trs = tableMain.getElementsByTagName("tr");//通过标签获得行
                for (var i = 0; i < trs.length; i++) {
                    var tr = trs[i];
                    //tr.style.crusor = "hand";//firfox不支持,ie通过
                    tr.style.cursor = "pointer";//设置鼠标变为小手状
                    tr.onmouseover = function() {
                        this.style.backgroundColor = "red";//背景变为红色
                    }
                    tr.onmouseout = function() {
                        this.style.backgroundColor = "White";//背景变为白色
                    }
                }
            }
        }
        window.onload = changeColor;
        /**
           JQuery版隔行变色
           1.首先通过 $("#talbeMain tr")取得行对象
           2.设置鼠标移动到行的事件
           3.链式编程
        */
        $(function() {
            $("#talbeMain tr").mouseover(function() {
            $(this).css("backgroundColor", "red").css("cursor","pointer");
               
            }).mouseout(function() { $(this).css("backgroundColor","White")});
        });
    </script>
</head>
<body>
     <table id="talbeMain">
        <tr><td>first</td></tr>
        <tr><td>second</td></tr>
        <tr><td>thrid</td></tr>
        <tr><td>four</td></tr>
    </table>
</body>
</html>
作者: 蒙武辉    时间: 2012-2-19 20:47
对javascript不是很理解，请问楼主javascript很重要吗？开发什么时候经常用呢？
作者: 王睿    时间: 2012-2-20 02:44
蒙武辉 发表于 2012-2-19 20:47
对javascript不是很理解，请问楼主javascript很重要吗？开发什么时候经常用呢？ ...

这个比java好学多了，在做网页动态效果时必用，其他方面就不知道了，我也是0基础自学呢！



欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2