HTML、CSS、JS對unicode字符的不同處理

 unicode字符的不同表示法

  unicode字符在html、css和js中的表示方法均不相同,下面分別作介紹。
  原文發表于 這里

  css表示法

  首先來一段很常見的bootstrap的字體圖標代碼:

  1. .glyphicon-home:before {

  2.     content: "\e021";

  3. }

復制代碼

  上面代碼中的 e021 就是這個字符的unicode碼,是16進制。
  語法:

  1. '\ + 16進制的unicode編碼'

復制代碼

  如:'\5b89'表示漢字“安”:

  1. <div class="test"></div>

  2. <style>

  3. .test: before {content: "\e021";}

  4. </style>

復制代碼

  js表示方法

  語法:

  1. '\u + 16進制的unicode編碼'

復制代碼

  示例:

  1. // 如:'\u5b89'表示漢字“安”

  2. console.log('\u5b89'); // 輸出“安”

復制代碼

  html表示方法

  html特殊一點,使用的是 10進制 ,一開始沒注意這個搞的半天出不來郁悶很久。
  語法:

  1. '&# + 10進制的unicode編碼 + 英文分號;'

復制代碼

  如 & #23433; (注意,由于正常書寫的話發表之后會被轉換成漢字,所以我這里故意中間留了空格防止轉換)表示漢字 安 ,結尾的分號經測試不加也沒問題,但是最好還是加一下。

  1. <div>

  2.     這是unicode表示的字符“安”:& #23433;(這里故意留一空格防止轉換)

  3. </div>

復制代碼

  另外,一些特殊字符還有其它表示,也就是常說的 html轉義字符 ,如(由于自動轉換問題,這里用圖片表示):
1.png 
  完整的HTML轉義字符表可以參見這里:
  //tool.oschina.net/commons?type=2

  獲取漢字的unicode編碼

  那么,如何知道一個漢字的unicode的編碼呢?很簡單:

  1. '安'.charCodeAt(); // 輸出的 23433 就是漢字 安 的unicode編碼,不過注意是10進制的

  2. String.fromCharCode(23433); // 輸出 '安'

復制代碼

  得到了10進制的unicode編碼,再如果想在js和css里面用的話,就需要用 toString(16) 轉16進制再做進一步處理了。

  1. var unicode = '\\u'+'茗'.charCodeAt().toString(16); // 輸出字符串:"\u8317"

  2. JSON.parse('"'+unicode+'"'); // 輸出漢字:"茗"

  3. eval('"'+unicode+'"'); // 或者使用eval解析也可以

復制代碼


來源:CSDN


上一篇: 前端開發人員須知html5和html4之間的區別

下一篇: Google 推出新版 Chrome:HTML5 取代 Flash 成為默認選項

分享到: 更多
黑马收费计划怎么样 什么叫平特一肖怎么买 赌博电子游戏能赢钱吗 重庆市彩开奖号码记录 时时彩平刷稳赚方案 大乐透蓝球有几个组成 澳门赌桌21点规则 pk10技巧稳赚五码论坛 什么平台有腾讯分分彩玩 时时彩刷水稳赚的玩法 足球大小球是什么意思 麻将必胜技巧大全 网易老时时开奖 时时彩组三组六一起买怎么稳赚不赔 世界杯足球直播 快乐时时计划软件