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日

悬赏问题

  • ¥120 计算机网络的新校区组网设计
  • ¥20 完全没有学习过GAN，看了CSDN的一篇文章，里面有代码但是完全不知道如何操作
  • ¥15 使用ue5插件narrative时如何切换关卡也保存叙事任务记录
  • ¥20 海浪数据 南海地区海况数据，波浪数据
  • ¥20 软件测试决策法疑问求解答
  • ¥15 win11 23H2删除推荐的项目，支持注册表等
  • ¥15 matlab 用yalmip搭建模型，cplex求解，线性化处理的方法
  • ¥15 qt6.6.3 基于百度云的语音识别 不会改
  • ¥15 关于#目标检测#的问题：大概就是类似后台自动检测某下架商品的库存，在他监测到该商品上架并且可以购买的瞬间点击立即购买下单
  • ¥15 神经网络怎么把隐含层变量融合到损失函数中？