jQuery Utilities
jQuery provides a set of miscellaneous methods which can be used for various reasons explained in this tutorial:
There are two important methods provided by latest version of jQuery to detect the browser and its associated features.
Getting Browser Version:
The jQuery.browser method contains flags for the useragent, read from navigator.userAgent.
Following example would show how to get browser name and its version:
<html>
<head>
<title>the title</title>
<script type="text/javascript"
src="/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
jQuery.each(jQuery.browser, function(i, val) {
$("<div>" + i + " : <span>" +val + "</span>")
.appendTo(document.body);
});
});
</script>
<style>
p { color:green; font-weight:bolder; margin:3px 0 0 10px; }
div { color:blue; margin-left:20px; font-size:14px; }
span { color:red; }
</style>
</head>
<body>
<p>Browser info:</p>
</body>
</html>
For my PC it would display following result:
Browser info:
version : 7.0
safari : false
opera : false
msie : true
mozilla : false
Getting Browser Properties:
The jQuery.support method contains a collection of properties that represent the presence of different browser features or bugs.
You can test the following properties usingjQuery.support :
Property
Description
boxModel
Is equal to true if the page and browser are rendering according to the W3C CSS Box Model. This is currently false in IE 6 and 7 when they are in Quirks Mode.
cssFloat
Is equal to true ifstyle.cssFloat is used to access the current CSS float value. This is currently false in IE, it uses styleFloatinstead
hrefNormalized
Is equal to true if the browser leaves intact the results from getAttribute. This is currently false in IE, the URLs are normalized.
htmlSerialize
Is equal to true if the browser properly serializes link elements wheninnerHTML is used. This is currently false in IE.
leadingWhitespace
Is equal to true if the browser preserves leading whitespace wheninnerHTML is used. This is currently false in IE 6-8.
noCloneEvent
Is equal to true if the browser does not clone event handlers when elements are cloned. This is currently false in IE.
objectAll
Is equal to true if doinggetElementsByTagName("*") on an object element returns all descendant elements. This is currently false in IE 7 and IE 8.
opacity
Is equal to true if a browser can properly interpret the opacity style property. This is currently false in IE, it uses alpha filters instead.
scriptEval
Is equal to true if usingappendChild/createTextNodeto inject inline scripts executes them. This is currently false in IE, it uses .text to insert executable scripts.
style
Is equal to true ifgetAttribute("style") is able to return the inline style specified by an element. This is currently false in IE - it uses cssText instead.
tbody
Is equal to true if the browser allows table elements without tbodyelements. This is currently false in IE, which automatically inserts tbodyif it is not present in a string assigned to innerHTML.
Following example would show how to get box model property of a document:
<html>
<head>
<title>the title</title>
<script type="text/javascript"
src="/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$("p").html("This document uses the W3C box model: <span>" +
jQuery.support.boxModel + "</span>");
});
</script>
<style>
p { color:blue; margin:20px; }
span { color:red; }
</style>
</head>
<body>
<p></p>
</body>
</html>
For my PC it would display following result:
This frame uses the W3C box model: true
ليست هناك تعليقات:
إرسال تعليق