zoukankan      html  css  js  c++  java
  • JS魔法堂:再识ASCII实体、符号实体和字符实体

    一、前言                                         

      相信大家都熟悉通过字符实体   来实现多个连续空格的输入吧!本文打算对三类HTML实体及JS相关操作作进一步的整理和小结,若有纰漏请大家指正,谢谢。

    二、初识HTML实体                                                                 

      由于HTML中某些字符是预留的(如>和<等),若要在进行HTML解析出来后能正确显示预留字符,则需要使用字符实体来代替了。

      字符实体有三种表示方式:

    // Named character reference(实体名)
    // 示例:&nbsp;
    &entity_name;
    
    // Decimal numeric character reference(十进制实体编号)
    // 示例:&#229
    &#entity_number;
    
    // Hexademical numeric character reference(十六进制实体编号)
    // 示例:&#x6C34
    &#xentity_number;

      实体名好处是便于记忆,但不一定所有浏览器能识别所有实体名。

      而所有浏览器均能识别所有的实体编号。

      注意:实体名是大小写敏感的哦!

    三、3种实体类型                                     

      实体分为ASCII实体、字符实体和符号实体。具体请参考HTML ISO-8859-1 参考手册XHTML Character Entity Reference

      对于每个实体的使用请参考@张鑫旭的《web页面相关的一些常见可用字符介绍》,这里就借用一下关于空格符部分的内容。

      &nbsp; ,不是space键产生的空格。宽度受到字体的影响。代表non-breaking space(不间断空白),严格语义上是使用场景不希望自动换行时使用,但浏览器会合并多个半角空格(u0020,由space键产生的空格),因此我们习惯用&nbsp(unicode为u00A0)来描述多个空格。

      &ensp; ,1/2个中文字符宽度,且宽度不受字体的影响。

      &emsp; ,1个中文字符宽度,且宽度不受字体的影响。

      &thinsp; ,1/15个em宽度的space,在标准的情况下差不多1px,有时候指1/16em,参考http://en.wikipedia.org/wiki/Thin_space

      题外话:全角空格的unicode为u3000。

      

    四、通过outerHTML,innerHTML,innerText,textContent和value操作实体 

      首先我们需要将3种实体类型分成两类,ASCII实体为一类,字符实体和符号实体为一类。

      对于ASCII实体

         1. 非表单元素的outerHTML和innerHTML只能获取实体名或实体编号;

         2. IE/Chrome下非表单元素的innerText可获取对应的字符;

         3. IE9+/FF/Chrome的非表单元素的textContent可获取对应的字符;

         4. textarea的value可获取对应的字符。

      对于字符实体和符号实体

         只能获取对应的字符,无法直接获取实体名和实体编号。

    五、总结                                  

      若有纰漏请大家指正,谢谢。

      尊重原创,转载请注明来自:http://www.cnblogs.com/fsjohnhuang/p/4319483.html ^_^肥仔John

  • 相关阅读:
    Asp.Net Web API 2第八课——Web API 2中的属性路由
    Asp.Net Web API 2第七课——Web API异常处理
    Asp.Net Web API 2第六课——Web API路由和动作选择
    Asp.Net Web API 2第五课——Web API路由
    开始学习python
    BMI 小程序 购物车
    深浅copy 文件操作
    字典 dict 集合set
    基本数据类型 (str,int,bool,tuple,)
    python 运算符
  • 原文地址:https://www.cnblogs.com/fsjohnhuang/p/4319483.html
Copyright © 2011-2022 走看看