编码图标字体HTML实体

我正在使用FontAwesome，并希望从包含图标的元素中读取编码的HTML实体。例如，假设我有这样的HTML DOM中：编码图标字体HTML实体

<span class="fa">&#xf005;</span>

我如何从一个元素读取值回来了，？ innerHTML给出了解码后的字符。

Mathias Bynen的图书馆he.js完美地处理了这个问题，但对于客户端项目而言，它包含了很多重要的内容（〜85kb unminified！），我想要一个轻量级的解决方案，不一定需要掩盖每一个边缘情况。

这里是一个说明该问题的小提琴：http://jsfiddle.net/ohfuffm9/

来源

2014-09-11 WickyNilliams

经过一番挖掘，我发现this gist在线哪种做我想做的，除了它期望实体为十进制值。我把它清理了一下（略微不寻常的代码风格原始），并修改为处理十六进制值。

// encode(decode) html text into html entity (assuming entity is hex) 
var HtmlEntity = { 
    decode : function(str) { 
    return str.replace(/&#x([0-9A-F]+);/gi, function(match, dec) { 
     return String.fromCharCode(parseInt(dec, 16)); 
    }); 
    }, 

    encode : function(str) { 
    var buf = []; 
    for (var i = 0, length = str.length; i < length; i++) { 
     buf.push("&#x" + str[i].charCodeAt().toString(16) + ";"); 
    } 
    return buf.join(""); 
    } 
}; 

var entity = '&#x9ad8;&#x7ea7;&#x7a0b;&#x5e8f;&#x8bbe;&#x8ba1;'; 
var str = '高级程序设计'; 
console.log(HtmlEntity.decode(entity) === str); // true 
console.log(HtmlEntity.encode(str) === entity); // true

这可以很容易地修改，以处理十六进制和十进制的实体，而是我的使用情况是非常有限的，所以我选择不。

这里是一个小提琴，显示预期的结果：http://jsfiddle.net/ohfuffm9/4/

来源

2014-09-11 11:36:50 WickyNilliams

字符引用是由浏览器解析HTML源代码时进行处理，并存储只是在DOM的解释字符。没有办法找回标记中的原始字符串。但是，如果您知道元素内容是单个代码点，如U + F005，则无论HTML代码中的代码点如何表示，您都可以将该代码点作为字符值处理JavaScript的。您可以将数字代码点值设为icon.innerHTML.charCodeAt(0)。该值以十进制表示，例如61445。如果需要，将其转换为十六进制。而且你甚至可以通过在十六进制值前后添加一些字符来构造字符串。但通常情况下，与角色一起工作会更简单。

来源

2014-09-11 11:10:11

这是有用的信息，谢谢。经过一番挖掘，我把一个工作解决方案放在一起。看到我的答案。我赞成让我走上正确的道路 – WickyNilliams 2014-09-11 11:37:20

编码图标字体HTML实体

回答

相关问题