Browser compatibility

[Simon Wigzell]

I cobbled together the following function from examples on the internet to
set named spanned items in the parent form. It works fine for IE but not at
all for netscape. What other browser conditions do I need to test for and
what is the correct syntax for the
sode so that I am covered for all cases? Thanks!

function WriteContent(name, newText)
{
var browser=navigator.appName
var version=parseInt(navigator.appVersion)

if (browser=="Microsoft Internet Explorer")
eval("self.opener.document.all."+name+".innerHTML='"+newText+"'");
else
{
self.opener.document.layers[name].document.close();
self.opener.document.layers[name].document.write(newText);
self.opener.document.layers[name].document.close();
}
}

 

[Simon Wigzell]

I cobbled together the following function from examples on the internet to
set named spanned items in the parent form. It works fine for IE but not at
all for netscape. What other browser conditions do I need to test for and
what is the correct syntax for the
sode so that I am covered for all cases? Thanks!

function WriteContent(name, newText)
{
var browser=navigator.appName
var version=parseInt(navigator.appVersion)

ditch the unreliable .appName and .appVersion

if (browser=="Microsoft Internet Explorer")
eval("self.opener.document.all."+name+".innerHTML='"+newText+"'");

no eval needed:
self.opener.document.all[name].innerHTML =

else
{
self.opener.document.layers[name].document.close();
self.opener.document.layers[name].document.write(newText);
self.opener.document.layers[name].document.close();
}
}

You cover document.all and document.layers, what about the modern browsers that
use getElementById?

Note the lack of concern about the browser:

function WriteContent(name, newText){
if (document.getElementById)
{
//use getElementById
self.opener.document.getElementById(name).innerHTML = newText;
//inserting text via innerHTML is inefficient when compared to DOM
//methods.
}
else
{
if (document.all)
{
self.opener.document.all[name].innerHTML = newText;
}
else
{
if (document.layers)
{
//document.layers statements here
}
else
{
alert('You're browser seems not to support dynamic content insertion');
}
}
}

And absolutely *no* concern about what browser it is, but what features it
supports.
http://www.jibbering.com/faq/#FAQ4_26

As a side note:
alert(navigator.appName)

when executed in the AOL browser gives "Microsoft Internet Explorer" but it is
far from being the same browser. And goes to show the fallacy of relying on
.appName when trying to determine my browser.

Thanks! Looks like a big improvement on what I had.

 

[Lasse Reichstein Nielsen]

I cobbled together the following function from examples on the internet to
set named spanned items in the parent form.

The worst part of the internet is that there is no quality control

It works fine for IE but not at all for netscape. What other browser
conditions do I need to test for and what is the correct syntax for
the sode so that I am covered for all cases?

All cases would include Javascript not being available, or that
changing the document content isn't possible at all. I guess you are
excluding these cases.

function WriteContent(name, newText)
{
var browser=navigator.appName
var version=parseInt(navigator.appVersion)

If you want to use a property or object, test for it specifically
instead of trying to guess the browser version.

if (browser=="Microsoft Internet Explorer")
eval("self.opener.document.all."+name+".innerHTML='"+newText+"'");

You should never use eval for accessing properties or variables. You
will probably never need to use eval at all. The exceptions are few
and rare, and it is a safe bet that you won't hit them.
This is (almost) equivalent and *much* more effective:
self.opener.document.all[name].innerHTML=newText;

The "almost" refers to the case where the value of newText contains a
single quote ('). In that case, the eval version fails.

else
{
self.opener.document.layers[name].document.close();

document.layers only exist in Netscape 4. Netscape 6+ is a complete
rewrite (it is a branded version of the Mozilla browser) and is not
compatible with Netscape 4.

self.opener.document.layers[name].document.write(newText);
self.opener.document.layers[name].document.close();
}
}

If newText contains a text string, and not HTML, then use the following:

---
function getElem(doc,id) {
if (doc.getElementById) {
return doc.getElementById(id);
} else if (doc.all) {
return doc.all[id];
} else if (doc.layers) {
return doc.layers[id];
}
return null; // this is not happening
}

function writeContent(name,newText) {
var doc = opener.document;
var elem = getElem(doc,name);
if (doc.createTextNode) { // Modern browsers
var text = doc.createTextNode(newText);
while(elem.hasChildNodes()) {
elem.removeChild(elem.lastChild);
}
elem.appendChild(text);
} else if (elem.innerHTML) { // IE 4
elem.innerHTML = newText; // Maybe use .innerText
} else if (elem.document != doc) { // NS 4
elem.document.open();
elem.document.write(newText);
elem.document.close();
}
}
---
No reference to browser name or version.
If newText contains HTML, you will have to drop the first method,
or parse the HTML yourself.
Tested in Netscape 4, Mozilla FB 0.7, IE 6, and Opera 7

/L

 

[David Leverton]

HikksNotAtHome wrote:

[snip]

if (document.getElementById)
{
//use getElementById
self.opener.document.getElementById(name).innerHTML = newText;
//inserting text via innerHTML is inefficient when compared to DOM
//methods.
}

[snip]

Where in the DOM standard is innerHTML defined? I can't find it anywhere.

 

[Lasse Reichstein Nielsen]

Where in the DOM standard is innerHTML defined? I can't find it anywhere.

It isn't. The property "innerHTML" was invented by Microsoft. Web
authors liked it, so some other browsers (Mozilla and Opera 7) have
also implemented it to preserve compatability with existing pages.
It is not official DOM.

/L

 

[Douglas Crockford]

Where in the DOM standard is innerHTML defined? I can't find it anywhere.

It is not a standard DOM feature, but it is necessary feature because it give
you access to the HTML parser. It is a Microsoft feature, which has also been
adopted by Mozilla and others.

http://www.crockford.com/

 

[Lasse Reichstein Nielsen]

[innerHTML]

It is not a standard DOM feature, but it is necessary feature because it give
you access to the HTML parser.

I don't see why that is necessary. Handy, yes, but necessary?

I would prefer a function with a type like:
DocumentFragment parseHTML(String)
That would fit much better with the official DOM functions.

Well, maybe in DOM v3

/L

 

[Yann-Erwan Perio]

[innerHTML]

I would prefer a function with a type like:
DocumentFragment parseHTML(String)
That would fit much better with the official DOM functions.

Though I really like innerHTML, I can only agree to your suggestion.
FWIW, Mozilla has extended the Range model adding several useful
features, like the createContextualFragment method, which does exactly
what you suggest.

<URL: http://www.mozilla.org/docs/dom/domref/dom_range_ref26.html#1005287>


Regards,
Yep.

 

[Jim Ley]

I don't see why that is necessary. Handy, yes, but necessary?

I would prefer a function with a type like:
DocumentFragment parseHTML(String)

You would also need a serialiser... Which is the other thing it does
of course. DocumentFragment is also problematical (at least it's
proven so in SVG where parseXML exists), then you'd need to provide a
document context, which would mean you'd naturally need the method off
document, or maybe on every single element? none of it sounds that
neat from a JS perspective, I'm sure if it was simple we wouldn't be
waiting until DOM 3 - of course DOM-3 isn't that relevant to HTML
authoring, but in XML based stuff.

That would fit much better with the official DOM functions.

Yes, but remember the official DOM are language agnostic, so they
often have to fit with things that don't make for neat javascript.

Jim.