我正在嘗試將名為“spell”的陣列中的屬性分配給新創建的位于 div 容器中的 img 元素。
for (let i = 0; i <spell.length; i ){
let styles = spell[i]
let container = document.getElementById('imagecontainer');
let newImg = document.createElement('img');
let top = styles.top;
let left = styles.left;
let imgSrc = styles.src;
newImg.setAttribute('width','25px');
newImg.setAttribute('left',left);
newImg.setAttribute('top',top);
newImg.setAttribute('src',imgSrc);
newImg.setAttribute('height','25px')
newImg.setAttribute('position','absolute');
console.log(newImg.position)
container.appendChild(newImg);
}
但是,當我運行代碼時,它會將所有影像的 newImg.position 記錄為未定義。我不確定出了什么問題
uj5u.com熱心網友回復:
設定 style 屬性的屬性:https ://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style
const spell = [{
top: "10px",
left: "10px",
src: "foo.png"
}, {
top: "50px",
left: "50px",
src: "bar.png"
}];
const container = document.getElementById('imagecontainer');
for (let i = 0; i < spell.length; i ) {
let styles = spell[i];
let newImg = document.createElement('img');
let top = styles.top;
let left = styles.left;
let imgSrc = styles.src;
newImg.style.width = '25px';
newImg.style.height = '25px';
newImg.style.top = top;
newImg.style.left = left;
newImg.style.position = 'absolute';
newImg.setAttribute("src", imgSrc);
console.log(newImg.style.position);
container.appendChild(newImg);
}
<div id="imagecontainer"></div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/438231.html
標籤:javascript html css 位置
