Which browsers/versions support getElementsByTagNameNS(), and to which extent? I can't seem to find a good reference.
[Edit] I am interested in a complete reference, but my immediate need is for namespaced xml returned from an AJAX call (which jQuery doesn't seem to handle btw).
Sitepoint says Firefox as of version 1.5, Safari as of version 3 and Opera as of version 9.
Firefox versions lower than 3.6 did a case insensitive search which as corrected in version 3.6.
Microsoft claims to support it as of IE9. However, according to Dottoro, this is only true for HTML documents. I'm not sure if you can't really trust Dottoro because selecting by namespace does not make sense for HTML documents anyway.
You should be able to use XPath if getElementsByTagNameNS is not supported. Wrappers are required, though, since IE does not support the standard API – see Yaldex and NCZOnline for hints how to get IE to cooperate. Or ask Microsoft's support.
I would recommend to ensure XHTML documents have actually been served with a XML content type when you plan to use the function on the DOM of a web page.
Chromium 14 does also support the method (and honors namespaces in contrast to old Safari versions). Support might have been in long before, I just don't know the earliest Chrome/Chromium version with support.
It seems all browsers but not IE are supporting DOM Level 3 XPath. Use XPath to replace calls to getElementsByTagNameNS if there are issues with it. See NCZOnline for an introduction and notes on browser support.
I know this is old, but this might be useful to someone. You can just use plain old getElementsByTagName in IE. Instead of calling node.getElementsByTagNameNS('someNamespace', 'someNodeName'), call node.getElementsByTagName('someNamespace:someNodeName').
Or use the following shim:
var getElementsByTagNameNS = function(node, ns, tagName) {
if (node.getElementsByTagNameNS) {
return node.getElementsByTagNameNS(ns, tagName);
}
return node.getElementsByTagName(ns + ':' + tagName);
};
And call it like this:
getElementsByTagNameNS(someNode, 'someNamespace', 'someNodeName');
Have you taken a look at this reference?
Specifically, here.
Related
In my JavaScript I have a function detectEnvironmentAndGetLEAndDepot() which is called onload via HTML. I'm working with wicket, and need to take values held in the back-end, so I fire them to the screen, hide them, and search the <span> values from my JS for the name value, for example if(v.getAttribute('name') === 'LE'){do stuff} or if(v.getAttribute('name') === 'depot'){do stuff} (I'm sure not the most elegant solution, but I needed a quick one!). Then within the function detectEnvironmentAndGetLEAndDepot() I do a bit of formatting etc so the data is usable.
detectEnvironmentAndGetLEAndDepot() function (quite long, only relevant part) -
detectEnvironmentAndGetLEAndDepot = function() {
Array.from(document.getElementsByTagName('span')).forEach(function(v) {
//Search name tag for particular names, then do formatting
}
When I open this in IE11 I get the error in a popup SCRIPT438: Object doesn't support property or method 'from' which is related to the first line of the method above - the Array class. Help much appreciated.
As Array.from method is not supported by IE, you can try to use:
[].slice.call(document.getElementsByTagName('span')).forEach(function(v) {});
This doesn't require usage of any 3rd party libraries.
You could use an ES2015 polyfill, like es6-shim, Array.from or Babel polyfill
As explained by Mozilla here, the Array.from function is not yet supported by IE
you can use instead _underscore.js with function _.toArray(document.getElementsByTagName('span'))...
FYI:
'Array.from' not supported in the following document modes: Quirks, Internet
Explorer 6 standards, Internet Explorer 7 standards, Internet Explorer
8 standards, Internet Explorer 9 standards, Internet Explorer 10
standards, Internet Explorer 11 standards. Not supported in Windows
8.1.
source
At one point in our system we use javascript to read in a chunk of XML and then query that XML document using xPath.
Prior to IE 11, IE supported using xmldoc.selectSingleNode(“//xpath/string”) and the non IE browsers supported using a xmldoc.evaluate(“//xpath/string”). These both returned a similar object that we could then carry on interpreting to extract the data required.
In IE11 neither of these methods seem to be available.
It seems that IE11 has some support for XML documents in that when I read in the xml using the DOMParser object using the parseFromString method, it returns an object that the IE11 debugger calls an XMLDocument.
Thanks to #Martin Honnen for pointing out that some ActivXObjects are still supported in IE11!
var doc;
try {
doc = new ActiveXObject('Microsoft.XMLDOM');
doc.loadXML(stringVarWithXml);
var node = doc.selectSingleNode('//foo');
} catch (e) { // deal with case that ActiveXObject is not supported }
I've used "Microsoft.XMLDOM" as it is sugested here that it is a more generic call to what ever xml parser is present on the system, where as it sounds like "Msxml2.DOMDocument.6.0" will fail if that exact version is not present. (We do have to support all IE vers back to 6.0 at my place!)
This just works as it always has done. The only problem I had was that the old switch I used to detect IE vs other browsers was if (typeof ActiveXObject !== "undefined") failed as I guess they are trying to discourage it's use!
Thanks all for your help.
To expand on pixelmatt's answer, some results of my tests (Win 7 64bit with IE11) I did in order to get DOMParser to work as it did in IE9 and IE10 (in IE11 it now returns an XMLDocument object which appears to not support xpath queries?).
Turns out I could make it behave like in IE10 with the following meta tag:
<meta http-equiv="X-UA-Compatible" content="IE=10" />
Results without and with above meta:
And here are the XMLDocument's memebers (for reference):
I want to make a JS function that switch visible/hidden.
var foo = function(n){
var hidden_elements = document.getElementsByName('hidden');
for(var i=0;i<hidden_elements.length;i++){
hidden_elements[i].style.visibility = 'hidden';
}
hidden_elements[n].style.visibility = 'visible';
};
It works on Firefox and Chrome, but it doesn't on IE. Why?
Thanks in advance.
I would recommend saving yourself the horror and going with:
http://jquery.com/
http://mootools.net/docs/core
http://dojotoolkit.org/
etc....
The libraries do a lot to smooth over the surprises of different browsers. If you are being super minimalist you can always check the source for how they are handling the differences. Also have a look at quirksmode's compatibility listing.
I know I didn't give a solid answer but you are going to run into these troubles all the time and these are some good tools for hammering them out.
IE up to IE8 does not follow W3C specs. Microsoft has their own standards. Many scripting methods that work on Firefox or Chrome (which are W3C standards) may not work properly in various builds on IE.
Why don't you try something from scratch? Either that, or do some ease of access. You can do this by making a pattern for ids and dynamically building those ids (may be incremental). Then, access those tags from their id.
Access by name is not preferred. Id is most appropriate.
Your html is invalid. the "name" property needs to be unique. Use "class" instead.
Internet Explorer might give some issues, so DOM polyfills like flowjs could be used.
I'm trying to run an xpath-expression over an svg which is embedded in html. I just cannot figure out how to set up the parameters. I want find elements that have an arbitary attribute from a given namespace. I use the following xpath expression:
var xpathexp = "//*[#*[namespace-uri()='"+this.typo7namespace+"']]";
I tested this expression and it worked as expected.
this is the code to find the result set:
var result = this.svgdocument.contentDocument.evaluate( xpathexp, this.svgdocument.documentElement, null, XPathResult.ANY_TYPE, null );
Could anybody tell me, or post a link to a tutorial, how to deal with the namspaces, the namespace resolvers??
Greetings...
Here's the Mozilla tutorial on using XPath:
https://developer.mozilla.org/en/Introduction_to_using_XPath_in_JavaScript
Here's one on writing custom namespace resolvers:
https://developer.mozilla.org/en/Introduction_to_using_XPath_in_JavaScript#Implementing_a_User_Defined_Namespace_Resolver
I found these interfaces to be rather clunky, though, so I wrote an abstraction layer that would take the xpath string and a context node, and would return a regular js array. It works inside the browser and embedded in Java under Mozilla Rhino:
https://svn.apache.org/repos/asf/commons/sandbox/gsoc/2010/scxml-js/trunk/src/javascript/scxml/cgf/util/xpath.js
All of the above should work in all browsers except for IE6-9.
IE6-8 does not support SVG natively, so this should be less important to your question. For completeness, though, here's a good article describing XPath support in earlier IE8, including support for resolving namespaces:
http://www.nczonline.net/blog/2009/04/04/xpath-in-javascript-part-3/
Apparently, IE9 also does not include support for XPath in the browser, which is more problematic, as it does support SVG natively. Probably the best approach here is to use ActiveX to work with MSXML APIs:
IE9 selectSingleNode missing from beta, how to overcome this in JavaScript?
How do I find out if my browser supports Javascript 1.5 or not? using javascript of course. (or should I have googled or binged some more?)
For official “JavaScript”, that is Mozilla's implementation of ECMA-262, you can use the type attribute to detect version:
<script type="text/javascript;version=1.5"> v= '1.5'; </script>
<script type="text/javascript;version=1.6"> v= '1.6'; </script>
<script type="text/javascript;version=1.7"> v= '1.7'; </script>
...
This also works in Opera, (recent versions of which claim to support JavaScript 1.5). IE and Webkit will not execute any script with a version parameter in its type.
This is similar to the old-school language attribute:
<script language="javascript1.5"> v= '1.5'; </script>
...
This is generally considered obsolete, but it does work in more browsers. Recent Webkit browsers claim to support 1.7 and all IEs claim to support 1.3 only.
IE has its own versioning scheme for JScript, which you can sniff for through conditional comments:
<script type="text/javascript">
/*#cc_on #if (#_jscript_version>=5.5)
v= '5.5';
#end #*/
</script>
Other browsers you can't find out. As for ECMA-262 version, all modern browsers support the baseline of Third Edition (yeah, OK, there are small differences and outright bugs, especially in IE, but still). No browser supports large amounts of Fifth Edition yet, though that will come. (There was no Fourth Edition.)
None of this is very useful. As you can see, version numbers are all pretty woolly and don't really reflect what the browser supports terribly well. You are generally better off doing capability-sniffing. For example if you want ECMA-262-5's JSON features, see if window.JSON exists. If you want function binding, see if .bind exists on your function. You can often detect the lack of such features and patch in a native-JavaScript fallback for when they aren't available.
The syntactical features of JavaScript, however, can't be sniffed for. Just including something like a getter/setter definition in a block of JavaScript code will immediately give a syntax error in IE before you could sniff for their availability. But then this is usually not too big a problem because in practice you can't use these newer features anyway.
Its typically not worth trying.
If you want to make use of a specific feature, query to see if that feature is supported instead.
Even then, there's no guarantee that the feature is implemented correctly! ;-)
Case in point... IE supports document.getElementById(id); however unless you are using IE8 in IE8 Standards mode it can return one of many wrong results.
Another way you can do it, you can put inside try block some of it's syntax. for example:
try{
"use strict";
let x=1;//if it's works, then you have some supprot
console.info("Good news, ecma6 works ");
}catch(e){
console.warn("Sorry, but ecma6 still doesn't supported");
}
You can specify which version of Javascript should evaluate a block of code like this:
<script language="javascript1.5">
//this code gets run
</script>
More info here.
There are scripts out there that will generate a float containing the Javascript version. Here's a nice read on detection with Javascript: https://developer.mozilla.org/En/Browser_Detection_and_Cross_Browser_Support
Here is such script: http://www.docsteve.com/DocSteve/Samples/JS/js_version.html