jQuery如何获取文字的宽度？方法介绍-js教程-PHP中文网

jQuery如何获取文字的宽度？方法介绍

青灯夜游

发布： 2020-11-23 17:57:42

转载

3385 人浏览过

jQuery如何获取文字的宽度？下面本篇文章给大家介绍一下使用jq获取文字宽度的方法。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

jQuery如何获取文字的宽度？方法介绍

相关推荐：《jq视频》

获取字符串的长度很简单，但是如何获取一个字符串的字体宽度却是一个不太好操作的问题，今天查阅了许多资料，终于找到了解决方法：

1.首先，需要添加一个标签，HTML代码如下：

<body>
<span></span>
</body>

登录后复制

2.接下来直接在String的原型中添加获取文字宽度的函数，在js代码中加入以下代码即可：

String.prototype.visualLength = function()
        {
            let ruler = $("span");
            ruler.text(this);
            return ruler[0].offsetWidth;
        };

登录后复制

3.使用js来调用这个方法：

  let text = "分";
  let len = text.visualLength();
  console.log(len);

登录后复制

　　效果如下：

记得要引入jq，博主使用的是es6

更多编程相关知识，请访问：编程入门！！

以上是jQuery如何获取文字的宽度？方法介绍的详细内容。更多信息请关注PHP中文网其他相关文章！

php8，我来也

30分钟学会网站布局

尚观Oracle入门到精通视频教程

你的第一行 UNI-APP 代码

Flutter 从头到应用启动

兄弟连Linux新版视频教程

AXURE 9视频教程（适合产品经理交互产品设计UI）

零基础PS视频教程

16天带你入门UI视频教程

PS技巧和切片技巧视频教程

阿里云环境搭建以及项目上线视频教程

计算机网络概述——程序员必须掌握的基础知识

程序员必备教程——HTTP协议讲解

Websocket视频教程

jQuery如何获取文字的宽度？方法介绍