来源：js获取字符长度并计算px宽度 - 【云】风过无痕 - 博客园 (cnblogs.com)

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>JS计算文本字符串长度的两种方法</title>

</head>

<body>

    <span style="font:normal 36px Robot;">qwe</span>

</body>

<script>

    // 字节长度

    String.prototype.byteLength = function () {

        var length = 0;

        Array.from(this).map(function (char) {

            // 字符编码大于255，说明是双字节字符

            if (char.charCodeAt(0) > 255) {

                length += 2;

            } else {

                length++;

            }

        });

        return length;

    }

    // 获取文本px宽度* @param font{String}: 字体样式    eg: normal 36px Robot

    String.prototype.pxWidth = function (font) {

        var canvas = String.prototype.pxWidth.canvas || (String.prototype.pxWidth.canvas = document.createElement("canvas")),

            context = canvas.getContext("2d");

        font && (context.font = font);

        var metrics = context.measureText(this);

        return metrics.width;

    }

</script>

</html>

JS计算文本字符串字节长度和像素长度的方法的更多相关文章

  1. winform计算文本的所占的像素长度

    /// <summary> /// 计算文本的宽度 /// </summary> /// <param name="str"></para ...

  2. JS计算混合字符串长度

    用的是正则表达式 var str = ”坦克是tank的音译”; var len = str.match(/[^ -~]/g) == null ? str.length : str.length +  ...

  3. js把文本字符串转换为文件并下载

    ### 兼容性没有怎么处理啊 exportRaw('text.txt','123123123') function fakeClick(obj) { var ev = document.createE ...

  4. sql server2005版本中，len函数计算了字符串末尾的空格

    sql server2005版本中,len函数计算了字符串末尾的空格的长度,以下是测试脚本: print @@version declare @v varchar(max) set @v = 'hp, ...

  5. js混合计算字符串字节长度

    js混合计算字符串字节长度 function getBt(str) { ) { var char = str.match(/[^\x00-\xff]/ig); : char.length); } el ...

  6. JS计算字符串所占字节数

    最近项目有个需求要用js计算一串字符串写入到localStorage里所占的内存,众所周知的,js是使用Unicode编码的.而Unicode的实现有N种,其中用的最多的就是UTF-8和UTF-16. ...

  7. js计算字符串的字节数和字符串与二进制的相互转化

    一.js计算字符串的字节数方法: //blob获取字符串的字节 var debug = "好的"; var blob = new Blob([debug],{type : 'tex ...

  8. JS计算字符串长度(兼容后端PHP)

    /*** 计算字符串长度* 参数是要计算的字符串* 返回值当前字符串的长度*/function charactersLen (words) { let tempMapWordNum = {} let ...

  9. 【javascript基础】JS计算字符串所占字节数

    废话不说,直接正题吧. 最近项目有个需求要用js计算一串字符串写入到localStorage里所占的内存,众所周知的,js是使用Unicode编码的.而Unicode的实现有N种,其中用的最多的就是U ...

随机推荐

  1. ajax 请求登录超时跳转登录页解决方法

    在Filter里判断是否登录,如果未登录返回401状态 public class SelfOnlyAttribute : ActionFilterAttribute { public override ...

  2. drools规则属性(rule attributes)的使用

    一.介绍 规则属性是您可以添加到业务规则以修改规则行为的附加规范. 在 DRL 文件中,您通常在规则条件和操作的上方定义规则属性,多个属性位于单独的行中,格式如下: rule "rule_n ...

  3. 好客租房10-jsx的基本使用

    1.1createElement()的问题 1繁琐不简洁 2不直观 无法一眼看出所描述的结构 3不优雅 用户体验不爽 React.createElement("div",     ...

  4. NOI Online 2022 一游

    NOI Online 2022 一游 TG 啊,上午比提高,根据去年的经验,题目配置估计那至少一黑 所以直接做 1 题即可.(确信) 总体:估分 140,炸了但没完全炸 奇怪的过程 开题:3 2 1 ...

  5. Java开发学习(四)----bean的三种实例化方式

    一.环境准备 准备开发环境 创建一个Maven项目 pom.xml添加依赖 resources下添加spring的配置文件applicationContext.xml 最终项目的结构如下:    二. ...

  6. Bika LIMS 开源LIMS集——ERD实体关系定义（数据库设计）

    系统数据分类 数据分为四类: template 模板,基础静态数据 static 静态数据,核心静态数据,检测方法等 dynamic 动态数据,样品检测流程数据 organisation 组织机构数据 ...

  7. 你真的很了解printf函数吗？

    对C语言中经常使用的printf这个库函数,你是否真的吃透了呢? 系统化的学习C语言程序设计,是不是看过一两本C语言方面的经典著作就足够了呢?答案是显而易见的:不够.通过这种典型的入门级的学习方式,是 ...

  8. BUUCTF-[BJDCTF2020]认真你就输了

    [BJDCTF2020]认真你就输了 下载通过16进制查看发现是压缩包,直接就binwalk分离查看. 分离直接得到几个文件,不过好像压缩包里的和外面的文件是一样的,所以直接翻一下目录 直接就找到了 ...

  9. ABAP CDS DDHEADANNO

  10. kali 无线网络渗透测试

    一.无线网络渗透嗅探工具Kismet 如果要进行无线网络渗透测试,则必须先扫描所有有效的无线接入点.在Kali linux中,提供了一款嗅探无线网络工具Kismet.使用该工具可以测量周围的无线信号, ...