Address elements from custom namespace in IE

V

VK

I have this code failing to work in IE: getElementsByTagName doesn't
return elements from my JS namespace. What's wrong?


<html xmlns:js>
<head>
<title>Que</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">

<style type="text/css">
<!--
body { background-color: #FFFFFF}
@media all {
js\:link { font-style: italic; color: #0000FF; text-decoration:
underline; cursor: hand; cursor: pointer}
}
-->
</style>

<script type="text/javascript">
<!--
function normalizeLinks(){
var jsLink = document.getElementsByTagName('JS:LINK');
// The method above doesn't work with IE
// IE has some fancy twist I have to be reminded again
for (i=0; i<jsLink.length; i++) {
jsLink.title = '';
jsLink.style.fontStyle = 'normal';
}
}

if ('addEventListener' in self) {
self.addEventListener('load',normalizeLinks,false);
}
else {
self.attachEvent('onload',normalizeLinks);
}
//-->
</script>

</head>

<body>

<p>
<a href="http://www.mozilla.org/products/firefox/">Mozilla Firefox</a>
</p>

<p>
<js:link title="JavaScript function call..."
onclick="alert('Booh!')">JavaScript call 1</js:link>
</p>

<p>
<a href="http://www.microsoft.com/windows/ie/default.mspx">Microsoft
Internet Explorer</a>
</p>

<p>
<js:link title="JavaScript function call..." onclick="alert('Booh
again!')">JavaScript call 2</js:link>
</p>

<p>
<a href="http://browser.netscape.com/ns8/">Netscape Navigator</a>
</p>

<p>
<js:link title="JavaScript function call..." onclick="alert('Booh
again!')">JavaScript call 3</js:link>
</p>
</body>
</html>
 
M

Martin Honnen

VK said:
I have this code failing to work in IE: getElementsByTagName doesn't
return elements from my JS namespace. What's wrong?


<html xmlns:js>
var jsLink = document.getElementsByTagName('JS:LINK');
// The method above doesn't work with IE
<js:link title="JavaScript function call..."
onclick="alert('Booh!')">JavaScript call 1</js:link>

Does it help if you use an <?IMPORT> processing instruction
<http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/pi/import.asp>
to bind that prefix?
 
W

web.dev

VK said:
I have this code failing to work in IE: getElementsByTagName doesn't
return elements from my JS namespace. What's wrong?


<html xmlns:js>
<head>
<title>Que</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">

<style type="text/css">
<!--
body { background-color: #FFFFFF}
@media all {
js\:link { font-style: italic; color: #0000FF; text-decoration:
underline; cursor: hand; cursor: pointer}
}
-->
</style>

<script type="text/javascript">
<!--
function normalizeLinks(){
var jsLink = document.getElementsByTagName('JS:LINK');
// The method above doesn't work with IE
// IE has some fancy twist I have to be reminded again
for (i=0; i<jsLink.length; i++) {
jsLink.title = '';
jsLink.style.fontStyle = 'normal';
}
}

if ('addEventListener' in self) {
self.addEventListener('load',normalizeLinks,false);
}
else {
self.attachEvent('onload',normalizeLinks);
}
//-->
</script>

</head>

<body>

<p>
<a href="http://www.mozilla.org/products/firefox/">Mozilla Firefox</a>
</p>

<p>
<js:link title="JavaScript function call..."
onclick="alert('Booh!')">JavaScript call 1</js:link>
</p>

<p>
<a href="http://www.microsoft.com/windows/ie/default.mspx">Microsoft
Internet Explorer</a>
</p>

<p>
<js:link title="JavaScript function call..." onclick="alert('Booh
again!')">JavaScript call 2</js:link>
</p>

<p>
<a href="http://browser.netscape.com/ns8/">Netscape Navigator</a>
</p>

<p>
<js:link title="JavaScript function call..." onclick="alert('Booh
again!')">JavaScript call 3</js:link>
</p>
</body>
</html>


Just from a quick test, there is a DOM Level 2 method,
getElementsByTagNameNS(String namespaceURI, String localName). However,
this method is available in Firefox and not in IE. But, IE does have a
namespace collection, document.namespaces, in which you can iterate
through.
 
V

VK

Martin said:
Does it help if you use an <?IMPORT> processing instruction
<http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dh...>
to bind that prefix?

<?IMPORT...> seems useless w/o "implementation" attribute pointing to a
behavior source you want to import from. Anyway I tried <?IMPORT
namespace="js"> with no progress.


web.dev said:
IE does have a namespace collection, document.namespaces,
in which you can iterate through.

The only (and above it not documented) property of "namespace" related
to the internal content appeared to be "tagNames".
So this object seems to be for global namespace management
(switching/adding). Any way I tried to use
document.namespaces.tagNames which leads immediately to the script
error "Not implemented".

This error combined with Martin Honnen's tip may mean that you can
display but you cannot handle custom elements in IE w/o corresponding
DTD file properly written and included?

Something like:
<!DOCTYPE HTML PUBLIC "-//VK//DTD HTML X.XX//EN"
"http://www.geocities.com/schools_ring/js.dtd">
(The above is a joke and I *really* hope it will remain such).

This IE is a real Pandora box but we have to eat it somehow... But how?
 
J

Julian Turner

VK said:
I have this code failing to work in IE: getElementsByTagName doesn't
return elements from my JS namespace. What's wrong?


<html xmlns:js>
<head>
<title>Que</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">

<style type="text/css">
<!--
body { background-color: #FFFFFF}
@media all {
js\:link { font-style: italic; color: #0000FF; text-decoration:
underline; cursor: hand; cursor: pointer}
}
-->
</style>

<script type="text/javascript">
<!--
function normalizeLinks(){
var jsLink = document.getElementsByTagName('JS:LINK');
// The method above doesn't work with IE
// IE has some fancy twist I have to be reminded again
for (i=0; i<jsLink.length; i++) {
jsLink.title = '';
jsLink.style.fontStyle = 'normal';
}
}

if ('addEventListener' in self) {
self.addEventListener('load',normalizeLinks,false);
}
else {
self.attachEvent('onload',normalizeLinks);
}
//-->
</script>

</head>

<body>

<p>
<a href="http://www.mozilla.org/products/firefox/">Mozilla Firefox</a>
</p>

<p>
<js:link title="JavaScript function call..."
onclick="alert('Booh!')">JavaScript call 1</js:link>
</p>

<p>
<a href="http://www.microsoft.com/windows/ie/default.mspx">Microsoft
Internet Explorer</a>
</p>

<p>
<js:link title="JavaScript function call..." onclick="alert('Booh
again!')">JavaScript call 2</js:link>
</p>

<p>
<a href="http://browser.netscape.com/ns8/">Netscape Navigator</a>
</p>

<p>
<js:link title="JavaScript function call..." onclick="alert('Booh
again!')">JavaScript call 3</js:link>
</p>
</body>
</html>


For IE specific solutions, I suggest that you delve more deeply into
the MSDN web site, and experiment a little:-

Two aspects which may help are:-

1. You can still use getElementsById("link").

This will return all "link" elements from all namespaces in the
document. As long as the local (i.e. RHS name) name is unique to a
given namespace (which I admit rather defeats the object of a
namespace), it can achieve what you are looking for.

2. If you need to filter the collection of "link" elements returned,
then you can use the "scopeName" property, introduced from IE5, which
will return the the namespace (i.e. LHS name) - namely "js".

Julian
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,768
Messages
2,569,574
Members
45,051
Latest member
CarleyMcCr

Latest Threads

Top