个人中心
gpt4 book ai didi

javascript - 获取动态创建元素的 CSS 宽度(Javascript、DOM)

转载 作者：太空宇宙 更新时间：2023-11-04 01:12:42 25 4
gpt4 key购买 nike

我正在尝试以编程方式将 divs 添加到 DOM。我想将它们排列在“主”div 中的一个圆圈中，

<body>
<div id="master">


</div>

<script src="js/main.js"></script>
</body>

因此:

window.addEventListener('load',init);

let master;

function init() {
    master = document.getElementById('master');

    const count = 8;
    const radius = 50;
    for (let i=0; i<count;i++){
        const diva = document.createElement('div');
        diva.id = i;
        master.appendChild(diva);
        let {x,y} = returnCoords(100,100,degreesToRad((360/count) * i),radius);
        diva.style.left = x + "px";
        diva.style.top = y + "px";
        console.log(diva.style.width); // empty!
    }

}

function degreesToRad(degrees) {
   return degrees * (Math.PI / 180);

}

function radToDegrees(rad) {
    return radians * (180 / Math.PI);

}

function returnCoords(originX = 0, originY = 0,radians,radius) {
    let x = originX + (Math.cos(radians) * radius);
    let y = originY + (Math.sin(radians) * radius);
    return ({x,y});
}

这些 div 由 SCSS 设置样式:

#master {
  background:pink;
  height:300px;
  width:300px;
  position: relative;
  div {
    background: white;
    height:20px;
    width:20px;
    border:blueviolet solid 1px;
    position:absolute;
  }
}

这一切都很好。但是，我无法获取 div 的 width，即使它已添加到 DOM 中也是如此。 console.log(diva.style.width); 行没有产生任何结果。因此我无法根据宽度移动 divs。我错过了什么？

最佳答案

.style 属性读取元素的内联 样式，而不是 CSS 指定的样式。令人困惑，当然。在这里阅读更多相关信息:https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style

关于javascript - 获取动态创建元素的 CSS 宽度(Javascript、DOM)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50888877/

25 4 0
文章推荐： python - 按索引列表从 numpy 数组中切片子数组
文章推荐： javascript - Moustache.js 中的列表和来自 mongodb 的 bson 数据
文章推荐： c - PostgreSQL 数组结构
文章推荐： python - 我如何在 python 中编辑这个牛顿方法以循环直到连续猜测之间的差异小于 0.00001？
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com