innerHTML vs createElement

**RobG** · Jul 23 '05, 04:25 PM

Re: innerHTML vs createElement

Andrew Poulos wrote:[color=blue]
> Given that I need to be able to add a TYPE attribute when I'm using
> createElement and it seems to fail in both IE and FF (but not MZ)[/color]

Really? Then you have discovered a bug that no one else has.
Please post an example of your failing code. Below the signature
is a test case that happily creates inputs of whatever type you
want in both Firefox and IE (provided you enter a valid type to
create, of course).

[color=blue]
> is it 'safer' to use innerHTML instead?[/color]

No. But in some circumstances it is more convenient.
[color=blue]
> I can dynamically build the things I need to but I wondering if it will
> introduce some new problems that won't surface till I get to testing.[/color]

Without code or a URL to comment on, it's pointless speculating
what might be wrong.

--
Rob.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<title>type</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<script type="text/JavaScript">

// p is the element to add the input to
// t is the type of input to create
function addInput(p,t) {
var oT = document.create Element('INPUT' );
oT.type = t;
p.appendChild(o T);
}
</script>
</head><body>
<form action="">
<label for="typeField" >Enter an input type to append:
<input type="text" value="button" name="typeField "></label>
<br>
<input type="button" value="Add input" onclick="
addInput(this.f orm,this.form.t ypeField.value) ;
">
</form>
</body>
</html>

**Andrew Poulos** · Jul 23 '05, 04:25 PM

Re: innerHTML vs createElement

RobG wrote:[color=blue]
> Andrew Poulos wrote:
>[color=green]
>> Given that I need to be able to add a TYPE attribute when I'm using
>> createElement and it seems to fail in both IE and FF (but not MZ)[/color]
>
> Really? Then you have discovered a bug that no one else has.
> Please post an example of your failing code. Below the signature
> is a test case that happily creates inputs of whatever type you
> want in both Firefox and IE (provided you enter a valid type to
> create, of course).[/color]

Not so. See Michael Winter's comment (number 10) here:
<url:http://groups.google.c om.au/groups?hl=en&lr =&threadm=41c82 4cb%240%2425815 %245a62ac22%40p er-qv1-newsreader-01.iinet.net.au &rnum=1&prev =/groups%3Fq%3D%2 522Michael%2BWi nter%2522%2B%25 2Btype%2B%252BA ndrew%2BPoulos% 2522%26hl%3Den% 26lr%3D%26selm% 3D41c824cb%2524 0%252425815%252 45a62ac22%2540p er-qv1-newsreader-01.iinet.net.au %26rnum%3D1>

Also if you check an earlier thread titled "Dynamic Object tag works in
MZ but not FF" you'll see some code that fails, when the video is a .AVI
file.
[color=blue][color=green]
>> is it 'safer' to use innerHTML instead?[/color]
>
> No. But in some circumstances it is more convenient.[/color]

I sort of understand but when using DOM 'fails' I don't really have an
alternative.
[color=blue][color=green]
>> I can dynamically build the things I need to but I wondering if it
>> will introduce some new problems that won't surface till I get to
>> testing.[/color]
>
> Without code or a URL to comment on, it's pointless speculating
> what might be wrong.[/color]

Sorry, I was speaking generally. What I meant was, will innerHTML cause
'new' problems that may not surface until I test on other major OSs and
browsers? (My development machine is currently Win XP SP1 running IE 6
MZ 1.7.5 and FF 1.0. My other machine has Win 98SE and IE 5.)

Andrew Poulos

**RobG** · Jul 23 '05, 04:25 PM

Re: innerHTML vs createElement

RobG wrote:[color=blue]
> Andrew Poulos wrote:
>[color=green]
>> Given that I need to be able to add a TYPE attribute when I'm using
>> createElement and it seems to fail in both IE and FF (but not MZ)[/color]
>[/color]

Just checked the HTML 4 spec, TYPE attributes are allowed on
the following elements:

a (link), object, param, script, style, input, li, ol, ul and
button.

<URL:http://www.w3.org/TR/html4/index/attributes.html >

My limited example is on <input> types, what element were you
having trouble with?

--
Rob.

**Andrew Poulos** · Jul 23 '05, 04:25 PM

Re: innerHTML vs createElement

RobG wrote:
[color=blue]
> RobG wrote:
>[color=green]
>> Andrew Poulos wrote:
>>[color=darkred]
>>> Given that I need to be able to add a TYPE attribute when I'm using
>>> createElement and it seems to fail in both IE and FF (but not MZ)[/color]
>>
>>[/color]
>
> Just checked the HTML 4 spec, TYPE attributes are allowed on
> the following elements:
>
> a (link), object, param, script, style, input, li, ol, ul and
> button.
>
> <URL:http://www.w3.org/TR/html4/index/attributes.html >
>
> My limited example is on <input> types, what element were you
> having trouble with?
>[/color]
Putting TYPE attributes on an OBJECT tag fails for me in FF.

Here's a sample that fails in FF but not MZ:

window.onload = function() {
addParam = function(p,n,v) { /* parent, name, value */
var c = document.create Element("param" );
c.name = n;
c.value = v;
p.appendChild(c );
}

// parameters
var vidUrl = "media/sample.avi";
var vidTop = 100;
var vidLeft = 150;
var vidWidth = 320;
var vidHeight = 240;
var vidCont = 17; /* add 17px for the QT controller */

// create a DIV to contain the QT OBJECT
var v = document.create Element("div");
v.setAttribute( "id", "videoContainer ");
v.style.positio n = "absolute";
v.style.left = "0px";
v.style.top = "0px";
document.body.a ppendChild(v);

// QT OBJECT for non IE
var m = document.create Element("object ");
m.data = vidUrl;
m.type = "video/quicktime";
m.width = vidWidth;
m.height = vidHeight + vidCont;
m.style.positio n = "absolute";
m.style.left = vidLeft + "px";
m.style.top = vidTop + "px";
addParam(m,"Aut oStart","false" );
addParam(m,"Con troller","true" );
v.appendChild(m );
}

- The DOM inspector shows that the TYPE attribute has not been added to
FF while it is in MZ.
- The AVI plays in MZ but FF tells me there's a missing plugin.
- If I write it into the HTML it works in FF
- If I use innerHTML it works in FF
- Moving the adding of the attributes to after the appending of the
OBJECT tag had no apparent effect, ie it still didn't work.

Andrew Poulos

**RobG** · Jul 23 '05, 04:25 PM

Re: innerHTML vs createElement

Andrew Poulos wrote:[color=blue]
> RobG wrote:[/color]
[...][color=blue]
> Not so. See Michael Winter's comment (number 10) here:
> <url:http://groups.google.c om.au/groups?hl=en&lr =&threadm=41c82 4cb%240%2425815 %245a62ac22%40p er-qv1-newsreader-01.iinet.net.au &rnum=1&prev =/groups%3Fq%3D%2 522Michael%2BWi nter%2522%2B%25 2Btype%2B%252BA ndrew%2BPoulos% 2522%26hl%3Den% 26lr%3D%26selm% 3D41c824cb%2524 0%252425815%252 45a62ac22%2540p er-qv1-newsreader-01.iinet.net.au %26rnum%3D1>[/color]

Ah, so you are talking about adding type to an object tag.

Mike's words weren't a general comment that adding type
attributes won't work, but was (if I understand correctly)
specifically in regard to adding type to objects:

" 3) Ignore the type attribute. You will *not* be able to
set it. From what I found whilst playing, the type attribute
can only be set from code if the value is of a limited subset
of MIME types, and even then, the permitted types depend on
the other attributes of the element."
[color=blue]
> Also if you check an earlier thread titled "Dynamic Object tag works in
> MZ but not FF" you'll see some code that fails, when the video is a .AVI
> file.[/color]

Again, thanks for adding context.
[color=blue]
>[color=green][color=darkred]
>>> is it 'safer' to use innerHTML instead?[/color]
>>
>>
>> No. But in some circumstances it is more convenient.[/color]
>
>
> I sort of understand but when using DOM 'fails' I don't really have an
> alternative.[/color]

In this specific case, perhaps you don't. If you must add type
and if innerHTML is the only way, do it. To remove doubt,
feature test and if it fails, deal with it.

if (...innerHTML) {
// insert type using innerHTML
} else {
// hope it works without type?
}

The issue with innerHTML is that it is not a W3C standard, it is
a method created by Microsoft and copied by other browsers.

There is a discussion of innerHTML vs DOM here:

<URL:http://www.developer-x.com/content/innerhtml/>

Though I can't vouch for the accuracy or correctness of any of
the contributors' opinions and they are a bit dated (April 2002).

[...][color=blue]
> Sorry, I was speaking generally. What I meant was, will innerHTML cause
> 'new' problems that may not surface until I test on other major OSs and
> browsers? (My development machine is currently Win XP SP1 running IE 6
> MZ 1.7.5 and FF 1.0. My other machine has Win 98SE and IE 5.)[/color]

In general, if you keeps its use minimal, no. However, because
the "standard" is whatever Microsoft have implemented in IE,
there is no way to define what is the correct way for innerHTML
to do anything other than "this is how IE does it".

So the answer is: test, test, test... (but I think you knew
that!!) ;-)

--
Rob

**Michael Winter** · Jul 23 '05, 04:25 PM

Re: innerHTML vs createElement

On Thu, 06 Jan 2005 17:27:18 +1000, RobG <rgqld@iinet.ne t.auau> wrote:

[snip]
[color=blue]
> Mike's words weren't a general comment that adding type
> attributes won't work, but was (if I understand correctly)
> specifically in regard to adding type to objects:[/color]

Correct. Furthermore, the implication was that the type attribute wasn't
needed - the user agent managed without it. Whether that still applies in
this case, I'm not sure. I'll leave that to the OP.

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

innerHTML vs createElement

innerHTML vs createElement

Comment

Comment

Comment

Comment

Comment

Comment