Javascript 无法设置属性'；边框颜色'；未定义的_Javascript_Html

Javascript 无法设置属性'；边框颜色'；未定义的

javascript html

Javascript 无法设置属性'；边框颜色'；未定义的,javascript,html,Javascript,Html,我从一本书中复制了这个（…所以它“应该”工作），我不能让这个函数工作，它可能是重复的，但我搜索了一个答案，不能让它工作 “未捕获的TypeError:无法设置未定义的属性'borderColor'” 这可能很简单，但我认为问题出在到之间，我尝试将其设置为数组和对象，但我不太明白，任何简单解释的解决方案都将不胜感激函数更改边框（元素，到）{ element.style.borderColor=to； } var contentDiv=document.getElementById（'color

我从一本书中复制了这个（…所以它“应该”工作），我不能让这个函数工作，它可能是重复的，但我搜索了一个答案，不能让它工作

“未捕获的TypeError:无法设置未定义的属性'borderColor'”

这可能很简单，但我认为问题出在

到

之间，我尝试将其设置为数组和对象，但我不太明白，任何简单解释的解决方案都将不胜感激

函数更改边框（元素，到）{
element.style.borderColor=to；
}
var contentDiv=document.getElementById（'color'）；
contentDiv.onmouseover=函数（）{
更改边框（“红色”）；
};
contentDiv.onmouseout=函数（）{
变更边界（“黑色”）；
};
.box{
边框：1px纯红；
背景颜色：粉红色；
填充：10px；
}
.行{
边框：1px实心#000；
}

无标题文件
1.
您的changeBorder
方法需要两个参数，但您总是只使用一个参数来调用它
试试这个：
changeBorder(contentDiv, '[color]');

此外，如果
var contentDiv = document.getElementById('color');

语句是在DOM准备就绪之前执行的。
您需要设置this并像这样更改您的函数：
contentDiv.onmouseover = function(){
    changeBorder(this, 'red');
};

contentDiv.onmouseout = function(){
    changeBorder(this, 'black');
};

如果没有关键字this，将无法找到它。请记住，在您的函数中，您正在共享元素：
function changeBorder(element, to){
    element.style.borderColor = to;
}

changeBorder（'red'）->方法中的var元素是用字符串（'red'）设置的。字符串没有样式属性，因此element.style未定义，您不能使用未定义对象的属性（如borderColor）
您必须稍微修改代码。请检查以下代码：
<html>
  <head>      
     <style>
        .box{
              border: 1px solid red;
              background-color:pink;
              padding: 10px;
            }       
        .row {
            border: 1px solid #000;
        }
     </style>
  </head>

  <body>
  <div class="row" id="color">
        <div class="element">1</div>
   </div>   
   <script type="text/javascript">    
            function changeBorder(element, to){
                element.style.borderColor = to;
            }

            var contentDiv = document.getElementById('color');
            alert(contentDiv);

            contentDiv.onmouseover = function(){
                changeBorder(contentDiv,'red');
            };

            contentDiv.onmouseout = function(){
                changeBorder(contentDiv, 'black');
            };
      </script>   
  </body>
</html>


.盒子{
边框：1px纯红；
背景颜色：粉红色；
填充：10px；
}       
.行{
边框：1px实心#000；
}
1.
函数changeBorder（元素，到）{
element.style.borderColor=to；
}
var contentDiv=document.getElementById（'color'）；
警报（contentDiv）；
contentDiv.onmouseover=函数（）{
changeBorder（contentDiv，'red'）；
};
contentDiv.onmouseout=函数（）{
changeBorder（contentDiv，“黑色”）；
};
函数require元素
它应该是changeBorder（这个“红色”）
changeBorder函数有两个参数，一个是DOM，另一个是color value，但您只传递一个changeBorder（'red'）。谢谢@Hanif。是否有理由使用contentDiv
（可能在其他地方更改）通过这个？@Archer这个更好，但是我使用的示例调用可以在任何上下文中使用，而不仅仅是在事件侦听器的回调函数中。谢谢，这是可行的！！谢谢你的解释！