function size(){
for(i=0; i<squares; i++){
document.getElementById('table').innerHTML += "<div class='squareCell' id='objetive"+i+"'></div>";
}
document.getElementsByClassName('squareCell').style.width="300px";
document.getElementsByClassName('squareCell').style.height="300px";}
仍然收到“无法设置未定义的属性‘宽度’”并且不知道为什么。我不只是想解决这个问题,我想了解这里究竟发生了什么。
问候。
最佳答案
getElementsByClassName()
方法返回文档中具有指定类名的所有元素的集合,作为数组对象
如果你有一个类名 squareCell
那么你可以通过像这样定义第 0 个索引来实现
document.getElementsByClassName('squareCell')[0].style.width="300px";
document.getElementsByClassName('squareCell')[0].style.height="300px";
如果你想做多次使用循环
var x = document.getElementsByClassName('squareCell');
for(var i=0; i< x.length;i++){
x[i].style.width = "300px";
x[i].style.height = "300px";
}
或
var elements = document.getElementsByClassName('squareCell');
Array.from(elements).forEach(function(element) {
element.style.height = '50px';
element.style.width = '50px';
});
function makeSquare(){
var elements = document.getElementsByClassName('squareCell');
Array.from(elements).forEach(function(element) {
element.style.height = '50px';
element.style.width = '50px';
});
}
.squareCell{
background-color: #ff00ff;
margin: 5px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 20px;
}
<button onclick="makeSquare()">Make Square</button>
<br/>
<div class="squareCell">Test1</div>
<div class="squareCell">Test2</div>
<div class="squareCell">Test3</div>
<div class="squareCell">Test4</div>
<div class="squareCell">Test5</div>
<div class="squareCell">Test6</div>
关于html - 无法设置未定义的属性 'width',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39152148/