How to check if character isn't supported by the user's browser in JavaScript?
Browsers do not "support" displaying unicode characters, it's the font that is responsible. Of course, you can always directly include the font that you want to use to display the characters in the emoji section in Unicode with CSS.
Here is a free and open font that can display emojis.
In case you want to detect if a font exists, here is a tool for that.
Detect browser character support in javascript?
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">♯</span>
<span id="not-renderable">�</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.
How to check if 'let' is supported by the browser?
The only way to feature-detect a new syntax or keyword, is to eval
it (or, pass it to the not-much-better Function
constructor):
function detectLet(){
try{
return !!new Function('let x=true;return x')()
}catch(e){
return false
}
}
console.log(detectLet())
But also note that you can't conditionally use a new syntax, or try to catch a syntax error, since syntax errors happen before your code starts to run!
So, to conditionally use such a feature, you also need eval
, which is even worse...
if(detectLet()){
let foo = 'bar';
}
//SyntaxError if `let` isn't supported
if(detectLet()){
eval("let foo = 'bar';") //Wait... really?!
}
//No errors
Conclusion:
If you need to support (those really old) platforms, that don't support let
, then don't use let
.
Alternatively, you can transpile your code with tools like Babel
But as of 2022, all major browsers support let
(even IE!!!), so you can use it safely, and drop support for really legacy browsers.
How to detect if JavaScript is disabled?
I assume you're trying to decide whether or not to deliver JavaScript-enhanced content. The best implementations degrade cleanly, so that the site will still operate without JavaScript. I also assume that you mean server-side detection, rather than using the <noscript>
element for an unexplained reason.
There is no good way to perform server-side JavaScript detection. As an alternative it is possible to set a cookie using JavaScript, and then test for that cookie using server-side scripting upon subsequent page views. However this would be unsuitable for deciding what content to deliver, as it would not distinguish visitors without the cookie from new visitors or from visitors who did not accept the JavaScript set cookie.
Check in JS whether a CSS property is supported?
I think
if ("pointer-events" in document.body.style)
or
if ("pointerEvents" in document.body.style)
should be adequate in the case of SVG content.
Check if user is using IE
Use below JavaScript method :
function msieversion()
{
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
if (msie > 0) // If Internet Explorer, return version number
{
alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
}
else // If another browser, return 0
{
alert('otherbrowser');
}
return false;
}
You may find the details on below Microsoft support site :
How to determine browser version from script
Update : (IE 11 support)
function msieversion() {
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer, return version number
{
alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
}
else // If another browser, return 0
{
alert('otherbrowser');
}
return false;
}
Related Topics
JavaScript How to Check User Agent for Mobile/Tablet
Making Links Active in JavaScript
Grunt Plugin for Assets Versioning
Why Do Arabic Characters Behave as Separate Characters When Styling Single Arabic Character
Jquery Word for Word Fade in Effect
Svg Resizes on Hover in Safari Only
How to Disable Smooth Scrolling in Ie11
How to Check If CSS Calc() Is Available Using JavaScript
Bootstrap Modal Makes Scrollbar Disappear After Closing
How to Open Safari from a Webapp in iOS 7
CSS in My JavaScript Widget Colliding with Target Page CSS
Css3/Js Get Position of Element During Animation
Is It Possibly to Keep Vertical Rhythm Using Only CSS
How to Get Default Font Size in Pixels by Using JavaScript or Jquery
How to Dynamically Change the Value of a CSS Property Inside a Stylesheet
How to Scroll to Top on Route Change with React Router Dom V6
Using 'Order' Property to Position Flex Item Between Siblings