如何获取一个文字元素的宽度

如图，都是整行的宽度

img


正文长度小于30个字符，请进行修改！正文长度小于30个字符，请进行修改！

div是块级元素，可通过css将其转为行内块元素或行内元素，通过检查就可以看到宽度了
这三种元素显示模式的区别在于

块级元素一行显示一个，可设置宽高
行内块元素一行可显示多个，可设置宽高
行内元素一行可显示多个，不可设置宽高
修改的话在head里加style标签

<style>
      div {
     display: inline-block
}
</style>

或者可将inline- block（行内块），换为inline（行内）

可以直接获取dom里的文本长度

img

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div class="a">aaaaaaaaaaaaaaa</div>
  <script>
    var domA = document.querySelector('.a')
    var aText = domA.innerText
    console.log('字符长度：', aText.length)
  </script>
</body>
</html>