m0_58595582 2021-07-20 21:03 采纳率: 50%
浏览 24
已采纳

JavaScript能否获取元素的整体形状?

问题是:JavaScript能否获取元素的整体形状?
比如
1.在屏幕上的坐标,比如起始和/或结束的x轴和y轴
2.元素的圆角,比如设置了border-radius
3.元素的宽度和高度

  • 写回答

1条回答 默认 最新

  • li.siyuan 2021-07-20 21:19
    关注

    你那三个比如 都可以获取到

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>Title</title>
      <style>
        #test {
            background-color: red;
            width: 100px;
            border: 2px solid;
            border-radius: 25px;
        }
      </style>
    </head>
    <body>
    <div>元素1</div>
    <div id="test">元素2</div>
    
    <script>
      window.onload = function () {
          const test = document.getElementById('test');
          const style = window.getComputedStyle(test, null);
          console.log("Y坐标", test.offsetTop)
          console.log("X坐标", test.offsetLeft)
    
          console.log("border-bottom-left-radius", style["border-bottom-left-radius"])
          console.log("border-bottom-right-radius", style["border-bottom-right-radius"])
          console.log("border-end-end-radius", style["border-end-end-radius"])
          console.log("border-end-start-radius", style["border-end-start-radius"])
    
          console.log("宽度", style.width)
          console.log("高度", style.height)
      }
    </script>
    </body>
    </html>
    

    写代码不易 请采纳

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 已采纳回答 7月22日
  • 修改了问题 7月20日
  • 创建了问题 7月20日

悬赏问题

  • ¥20 测距传感器数据手册i2c
  • ¥15 RPA正常跑,cmd输入cookies跑不出来
  • ¥15 求帮我调试一下freefem代码
  • ¥15 matlab代码解决,怎么运行
  • ¥15 R语言Rstudio突然无法启动
  • ¥15 关于#matlab#的问题:提取2个图像的变量作为另外一个图像像元的移动量,计算新的位置创建新的图像并提取第二个图像的变量到新的图像
  • ¥15 改算法,照着压缩包里边,参考其他代码封装的格式 写到main函数里
  • ¥15 用windows做服务的同志有吗
  • ¥60 求一个简单的网页(标签-安全|关键词-上传)
  • ¥35 lstm时间序列共享单车预测,loss值优化,参数优化算法