javascript - 如何检查字符是否会显示在浏览器中

标签 javascript html character non-printable

<分区>

如果我想显示一个特殊字符,如⬀、⤴或➶,我如何查看用户的浏览器是否可以显示它?我不希望这个 Angular 色以 ▯ 的形式出现;如果可以,我宁愿显示一个正常的 ↗。

那么我怎样才能确保我发出的任何字符都正确显示呢?

我找到了 this answerthis question ,不幸的是,这在我的情况下不起作用。
诀窍是放置一个 DOM 树中不存在的字符,这样您就知道它不会显示,并将其宽度与您想要的字符的宽度进行比较。如果宽度相同,很可能您想要的字符也未定义,因此也不会显示。

但是,这个技巧并不适用于所有情况。链接的答案使用 U+FFFD 作为非显示字符,但在某些设备(在我的例子中是 Windows Mobile 手机)上,U+FFFD 是定义的字符,其宽度与用于未定义字符的字形不同( � 与 ▯)。此外,已知非字符的代码点(例如 U+FFFE)显示为问号 (?) 而不是 ▯s,因此它们也具有不同的宽度。

所以我的问题是,我可以将我的 Angular 色与什么进行比较,以便我知道它不会是不可显示的 Angular 色?

最佳答案

使用多个字符

假设您没有使用等宽字体, 使用 3 个以上来自不同语言的字符,很可能没有人安装所有这些字符。

然后在可以渲染它们的环境中测量它们的宽度,并将此数据提供给您的应用。

例如:

  • A 比 B 宽
  • B 比 C 宽

一个简单的算法是:

  1. 在用户环境中收集 A、B 和 C 的宽度。
    使用您描述的技术。

  2. 如果 A 比 B 宽,则 B 比 C 宽。
    回退到安全字符。

  3. 如果其中一个或所有顺序不正确。
    用那个作为▯。

结论

我知道这是基本的,但这是我能想到的最好的方法。

关于javascript - 如何检查字符是否会显示在浏览器中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21892798/

相关文章:

javascript - Angular $resource 不适用于 Controller

javascript - 如何在javascript中制作这样的结构

html - 无法设置任何文本样式。无法定位 p 标签或 h 标签

4列的jquery调整大小

javascript - 我如何使用 HTML 和 CSS 在一行中均匀地拆分按钮?

java - 如何在Java中将全角日语字符转换为半角日语字符?

java - 如何在 Java 中检测多项式

c - 为什么我的整数数组元素包含错误的值,当我在 C 中为其分配字符值时,我该如何解决这个问题?

javascript - d3 轴位于 [0,1] 域中

php - 服务器上的 javascript 和 php