在JavaScript中检测浏览器字符支持？ [英] Detect browser character support in javascript?

问题描述

我在一个音乐相关的网站上工作，经常使用特殊字符（♯）和平面（♭）的HTML特殊字符来保持内容漂亮，例如：

 &＃9839; 
&＃9837;但是，我注意到，在一些浏览器（IE6，Safari的PC）中，这些字符不是' t支持。我创建了一个有条件的JavaScript，提供明确的，支持的字符替代特殊的（G＃为G♯和Bb为B♭）。但我很难知道如何检测哪些浏览器缺少这些字符。
 
 
 
我知道我可以测试浏览器（例如ie6），但我是希望做正确的事情并测试字符支持本身。 
 
 
 
有没有人知道有一个很好的方法来使用javascript，jQuery或rails？ （页面由rails应用程序提供，因此请求对象和任何其他Rails魔术都在表上。
解决方案
如果创建两个SPAN，一个包含您想要的字符，另一个包含不可打印字符U + FFFD（&＃xfffd;）是一个好的，那么您可以测试它们是否具有相同的宽度。
 < div style =visibility：hidden> 
< span id =char-to-check& ;＃9839;< / span> 
< span id =not-renderable>&＃xfffd;< / span> 
< / div> 
<脚本> 
 alert（document.getElementById（'char-to-check'）。offsetWidth === 
 document.getElementById（'not-renderable'）。offsetWidth 
？'不支持' ：'supported'）; 
< / script> 
  
 DIV不使用固定字体样式。
 
I'm working on a music related website, and frequently use the HTML special characters for sharps (♯) and flats(♭) to keep things pretty, e.g.:
&#9839;
&#9837;
However, I've noticed that in some browsers (IE6, Safari for PC) those characters aren't supported. I've created a conditional javascript that serves up plain, supported characters in place of the special ones ( G# for G♯ and Bb for B♭ ). But I'm having a hard time figuring out how to detect which browsers lack those characters.

I know I could test for the browser (e.g. ie6), but I was hoping to do things right and test for character support itself. 

Does anyone know of a good way to do this using either javascript, jQuery, or rails? (The page is served by a rails app, so the request object and any other Rails magic is on the the table. 
解决方案
If you create two SPANs, one containing the character you want, and the other containing an unprintable character U+FFFD (�) is a good one, then you can test whether they have the same width.
<div style="visibility:hidden">
  <span id="char-to-check">&#9839;</span>
  <span id="not-renderable">&#xfffd;</span>
</div>
<script>
  alert(document.getElementById('char-to-check').offsetWidth ===
        document.getElementById('not-renderable').offsetWidth
        ? 'not supported' : 'supported');
</script>
You should make sure that the DIV is not styled using a fixed font.

                        
这篇关于在JavaScript中检测浏览器字符支持？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！