Changing borderStyle with javascript DOM1

Changing borderStyle with javascript DOM1

本文关键字：DOM1 javascript with borderStyle Changing      更新时间：2023-09-26

我只需要图像出现一个2px，绿色，固体边界一旦图像加载到页面上。我有这个:

img = getElementsByTagName("img");
for(i = 0; i < img.length; i++)
{
    img[i].style.borderStyle = "solid";
    img[i].style.borderWidth = "2px";
    img[i].style.borderColor = "green";
}

但是什么都没有发生…我错过了什么?

为什么不能只用css呢?

img {
    border: 2px solid green;
}

下面是一个使用javascript来分配样式值的例子

CSS 

div {
    width: 30px;
    height: 30px;
}
HTML 

<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
Javascript 

var elements = document.getElementsByTagName("div");
var length = elements.length;
var element;
for (var i = 0; i < length; i += 1) {
    element = elements[i];
    element.style.borderStyle = "solid";
    element.style.borderWidth = "2px";
    element.style.borderColor = "green";
}
在jsfiddle

尽管同样的效果也可以通过CSS定义来实现

CSS 

div {
    width: 30px;
    height: 30px;
    border-style: solid;
    border-width: 2px;
    border-colour: green;
}
HTML 

<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
在jsfiddle

相关文章：