如何使用纯 JavaScript 将字符转换为 HTML 实体

新手上路,请多包涵

我有以下内容:

 var text = "Übergroße Äpfel mit Würmern";

我正在寻找一个 Javascript 函数来转换文本,以便每个特殊字母都由其 HTML 实体序列表示,如下所示:

 var newText = magicFunction(text);
...
newText = "Übergroße Äpfel mit Würmern";

该函数 不仅 应该转义这个例子中的字母, 还应该转义所有这些字母。

你将如何实现这一目标?那里有任何现有功能吗? (简单,因为没有框架的解决方案是首选)

顺便说一句:是的,我已经看到 了这个问题,但它没有满足我的需要。

原文由 Chris 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 746
2 个回答

在 bucabay 的帮助和创建我自己的功能的建议下,我创建了这个适合我的功能。你们怎么看,有没有更好的解决方案?

 if(typeof escapeHtmlEntities == 'undefined') {
        escapeHtmlEntities = function (text) {
            return text.replace(/[\u00A0-\u2666<>\&]/g, function(c) {
                return '&' +
                (escapeHtmlEntities.entityTable[c.charCodeAt(0)] || '#'+c.charCodeAt(0)) + ';';
            });
        };

        // all HTML4 entities as defined here: http://www.w3.org/TR/html4/sgml/entities.html
        // added: amp, lt, gt, quot and apos
        escapeHtmlEntities.entityTable = {
            34 : 'quot',
            38 : 'amp',
            39 : 'apos',
            60 : 'lt',
            62 : 'gt',
            160 : 'nbsp',
            161 : 'iexcl',
            162 : 'cent',
            163 : 'pound',
            164 : 'curren',
            165 : 'yen',
            166 : 'brvbar',
            167 : 'sect',
            168 : 'uml',
            169 : 'copy',
            170 : 'ordf',
            171 : 'laquo',
            172 : 'not',
            173 : 'shy',
            174 : 'reg',
            175 : 'macr',
            176 : 'deg',
            177 : 'plusmn',
            178 : 'sup2',
            179 : 'sup3',
            180 : 'acute',
            181 : 'micro',
            182 : 'para',
            183 : 'middot',
            184 : 'cedil',
            185 : 'sup1',
            186 : 'ordm',
            187 : 'raquo',
            188 : 'frac14',
            189 : 'frac12',
            190 : 'frac34',
            191 : 'iquest',
            192 : 'Agrave',
            193 : 'Aacute',
            194 : 'Acirc',
            195 : 'Atilde',
            196 : 'Auml',
            197 : 'Aring',
            198 : 'AElig',
            199 : 'Ccedil',
            200 : 'Egrave',
            201 : 'Eacute',
            202 : 'Ecirc',
            203 : 'Euml',
            204 : 'Igrave',
            205 : 'Iacute',
            206 : 'Icirc',
            207 : 'Iuml',
            208 : 'ETH',
            209 : 'Ntilde',
            210 : 'Ograve',
            211 : 'Oacute',
            212 : 'Ocirc',
            213 : 'Otilde',
            214 : 'Ouml',
            215 : 'times',
            216 : 'Oslash',
            217 : 'Ugrave',
            218 : 'Uacute',
            219 : 'Ucirc',
            220 : 'Uuml',
            221 : 'Yacute',
            222 : 'THORN',
            223 : 'szlig',
            224 : 'agrave',
            225 : 'aacute',
            226 : 'acirc',
            227 : 'atilde',
            228 : 'auml',
            229 : 'aring',
            230 : 'aelig',
            231 : 'ccedil',
            232 : 'egrave',
            233 : 'eacute',
            234 : 'ecirc',
            235 : 'euml',
            236 : 'igrave',
            237 : 'iacute',
            238 : 'icirc',
            239 : 'iuml',
            240 : 'eth',
            241 : 'ntilde',
            242 : 'ograve',
            243 : 'oacute',
            244 : 'ocirc',
            245 : 'otilde',
            246 : 'ouml',
            247 : 'divide',
            248 : 'oslash',
            249 : 'ugrave',
            250 : 'uacute',
            251 : 'ucirc',
            252 : 'uuml',
            253 : 'yacute',
            254 : 'thorn',
            255 : 'yuml',
            402 : 'fnof',
            913 : 'Alpha',
            914 : 'Beta',
            915 : 'Gamma',
            916 : 'Delta',
            917 : 'Epsilon',
            918 : 'Zeta',
            919 : 'Eta',
            920 : 'Theta',
            921 : 'Iota',
            922 : 'Kappa',
            923 : 'Lambda',
            924 : 'Mu',
            925 : 'Nu',
            926 : 'Xi',
            927 : 'Omicron',
            928 : 'Pi',
            929 : 'Rho',
            931 : 'Sigma',
            932 : 'Tau',
            933 : 'Upsilon',
            934 : 'Phi',
            935 : 'Chi',
            936 : 'Psi',
            937 : 'Omega',
            945 : 'alpha',
            946 : 'beta',
            947 : 'gamma',
            948 : 'delta',
            949 : 'epsilon',
            950 : 'zeta',
            951 : 'eta',
            952 : 'theta',
            953 : 'iota',
            954 : 'kappa',
            955 : 'lambda',
            956 : 'mu',
            957 : 'nu',
            958 : 'xi',
            959 : 'omicron',
            960 : 'pi',
            961 : 'rho',
            962 : 'sigmaf',
            963 : 'sigma',
            964 : 'tau',
            965 : 'upsilon',
            966 : 'phi',
            967 : 'chi',
            968 : 'psi',
            969 : 'omega',
            977 : 'thetasym',
            978 : 'upsih',
            982 : 'piv',
            8226 : 'bull',
            8230 : 'hellip',
            8242 : 'prime',
            8243 : 'Prime',
            8254 : 'oline',
            8260 : 'frasl',
            8472 : 'weierp',
            8465 : 'image',
            8476 : 'real',
            8482 : 'trade',
            8501 : 'alefsym',
            8592 : 'larr',
            8593 : 'uarr',
            8594 : 'rarr',
            8595 : 'darr',
            8596 : 'harr',
            8629 : 'crarr',
            8656 : 'lArr',
            8657 : 'uArr',
            8658 : 'rArr',
            8659 : 'dArr',
            8660 : 'hArr',
            8704 : 'forall',
            8706 : 'part',
            8707 : 'exist',
            8709 : 'empty',
            8711 : 'nabla',
            8712 : 'isin',
            8713 : 'notin',
            8715 : 'ni',
            8719 : 'prod',
            8721 : 'sum',
            8722 : 'minus',
            8727 : 'lowast',
            8730 : 'radic',
            8733 : 'prop',
            8734 : 'infin',
            8736 : 'ang',
            8743 : 'and',
            8744 : 'or',
            8745 : 'cap',
            8746 : 'cup',
            8747 : 'int',
            8756 : 'there4',
            8764 : 'sim',
            8773 : 'cong',
            8776 : 'asymp',
            8800 : 'ne',
            8801 : 'equiv',
            8804 : 'le',
            8805 : 'ge',
            8834 : 'sub',
            8835 : 'sup',
            8836 : 'nsub',
            8838 : 'sube',
            8839 : 'supe',
            8853 : 'oplus',
            8855 : 'otimes',
            8869 : 'perp',
            8901 : 'sdot',
            8968 : 'lceil',
            8969 : 'rceil',
            8970 : 'lfloor',
            8971 : 'rfloor',
            9001 : 'lang',
            9002 : 'rang',
            9674 : 'loz',
            9824 : 'spades',
            9827 : 'clubs',
            9829 : 'hearts',
            9830 : 'diams',
            338 : 'OElig',
            339 : 'oelig',
            352 : 'Scaron',
            353 : 'scaron',
            376 : 'Yuml',
            710 : 'circ',
            732 : 'tilde',
            8194 : 'ensp',
            8195 : 'emsp',
            8201 : 'thinsp',
            8204 : 'zwnj',
            8205 : 'zwj',
            8206 : 'lrm',
            8207 : 'rlm',
            8211 : 'ndash',
            8212 : 'mdash',
            8216 : 'lsquo',
            8217 : 'rsquo',
            8218 : 'sbquo',
            8220 : 'ldquo',
            8221 : 'rdquo',
            8222 : 'bdquo',
            8224 : 'dagger',
            8225 : 'Dagger',
            8240 : 'permil',
            8249 : 'lsaquo',
            8250 : 'rsaquo',
            8364 : 'euro'
        };
    }

使用示例:

 var text = "Übergroße Äpfel mit Würmern";
alert(escapeHtmlEntities (text));

结果:

 &Uuml;bergro&szlig;e &Auml;pfel mit W&uuml;rmern

原文由 Chris 发布,翻译遵循 CC BY-SA 3.0 许可协议

这里建议的所有其他解决方案,以及大多数其他执行 HTML 实体编码/解码的 JavaScript 库,都会犯几个错误:

要获得避免所有这些问题的可靠解决方案,请使用我为此编写的名为 he 的库。 从它的自述文件:

_他_(“HTML 实体”)是一个用 JavaScript 编写的健壮的 HTML 实体编码器/解码器。它支持 按照 HTML 的所有标准化命名字符引用, 像浏览器一样 处理 不明确的&符号 和其他边缘情况,具有广泛的测试套件,并且 - 与许多其他 JavaScript 解决方案相反 - 可以很好地处理 astral Unicode 符号。 提供在线演示。

原文由 Mathias Bynens 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题