how to set attribute "name"

(#1)

Hi, this is my code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
</HEAD>

<BODY>
<input name="run" type="button" value="run code" onclick="showhtml()"/
>
<br/>
<br/>
<div id="D001" style="height:100%;width:100%;">
<textarea id="TA001" rows="6" cols="80"></textarea>
<br/>
<textarea id="TA002" rows="6" cols="80"></textarea>
</div>
</BODY>
</HTML>

-----------------------------------------------
for firefox it can set input name correctly, but ie can not set
name!
is there something like this:
ie: element.setAttribute("className", "myCss");
firefox: element.setAttribute("class", "myCss");

thanks anyway

(#2)

On Aug 21, 11:15 pm, Ding <xdd...@gmail.com> wrote:
> -----------------------------------------------
> is there something like this:
> ie: element.setAttribute("className", "myCss");
> firefox: element.setAttribute("class", "myCss");
>

IE chokes on setting the "name" attribute of an element that's already
in the DOM. See: http://msdn.microsoft.com/library/de...ies/name_2.asp
for MSDN's article on the issue. Unfortunately, the only way to
successfully do this is nonstandard and extremely bad practice. See
http://www.easy-reader.net/archives/...plementations/
for an example of what you're up against.

Good luck!

-David

(#3)

Thanks for the reply!
I get it.

(#4)

On Aug 23, 2:48 am, David Golightly <davig...@gmail.com> wrote:
> On Aug 21, 11:15 pm, Ding <xdd...@gmail.com> wrote:
>
> > -----------------------------------------------
> > is there something like this:
> > ie: element.setAttribute("className", "myCss");
> > firefox: element.setAttribute("class", "myCss");
>
> IE chokes on setting the "name" attribute of an element that's already
> in the DOM. See:http://msdn.microsoft.com/library/de...shop/author/dh...
> for MSDN's article on the issue. Unfortunately, the only way to
> successfully do this is nonstandard and extremely bad practice. Seehttp://www.easy-reader.net/archives/2005/09/02/death-to-bad-dom-imple...
> for an example of what you're up against.

I had a play with this, it seems that every solution uses either
browser sniffing or try..catch with IE's version of createElement
first then the W3C version second.

As an alternative, I thought about adding an element with a name using
W3C createElement, then trying to get it back using
getElementsByTagName. If it works, use a W3C createElement method.
If it fails, use an innerHTML based method for creating elements
(rather than assuming IE and using its version of createElement, the
string that needs to be constructed is the same).

A simple test is here, based on the idea that the head element is
always available to scripts, and that a meta element can have a name
attribute and can be added to the head:

function checkName() {
var randomName = 'foo_' + (new Date()).getTime();
var newElement = document.createElement('meta');
newElement.name = randomName;
document.getElementsByTagName('head')[0].appendChild(newElement);
return !!(document.getElementsByName(randomName)[0])
}

alert("Use W3C createElement? " + checkName());

It works in Firefox and IE 6 (all I have available at the moment).

It's just a proof of concept and needs a lot more effort yet, but do
you think it's a suitable feature test to use with a generic element
builder function? It could be delayed using window.onload, but I
think it should run as soon as possible.

Incidentally, the authors of Prototype.js say they have fixed the IE
name attribute issue with their new element builder functions, but
they rely on browser sniffing (a reliance that seems to be an
increasing in a number of libraries - v 1.6.0_rc0, #1579).

--
Rob

(#5)

On Aug 22, 12:48 pm, David Golightly <davig...@gmail.com> wrote:
> IE chokes on setting the "name" attribute of an element that's already
> in the DOM. See:http://msdn.microsoft.com/library/de...shop/author/dh...
> for MSDN's article on the issue. Unfortunately, the only way to
> successfully do this is nonstandard and extremely bad practice. Seehttp://www.easy-reader.net/archives/2005/09/02/death-to-bad-dom-imple...
> for an example of what you're up against.

Thanks for the tip. I found a comment on the blog referred to above
that was close. I modified it to eliminate the assignment side effect
and make it more functional, and I ran it through JSLint.

Also, I had to use x.setAttribute('name', 'foo') instead of x.name =
'foo' on Firefox 2.0.0.6 on Linux. I haven't tested my modifications
on IE, but there shouldn't be any semantic changes, so if the original
worked, this should also:

var createElementWithName = (function () {
try {
var el = document.createElement('<div name="foo">');
if (el.tagName !== 'DIV' || el.name !== 'foo') {
throw 'create failed';
}
return function (tag, name) {
return document.createElement('<' + tag + ' name="' + name +
'"></' + tag + '>');
};
} catch (e) {
return function (tag, name) {
var el = document.createElement(tag);
el.setAttribute('name', name);
return el;
};
}
})();

(#6)

On Aug 24, 10:00 am, Brian Adkins <lojicdot...@gmail.com> wrote:
> var createElementWithName = (function () {
> try {
> var el = document.createElement('<div name="foo">');
> if (el.tagName !== 'DIV' || el.name !== 'foo') {
> throw 'create failed';
> }
> return function (tag, name) {
> return document.createElement('<' + tag + ' name="' + name +
> '"></' + tag + '>');
> };
> } catch (e) {
> return function (tag, name) {
> var el = document.createElement(tag);
> el.setAttribute('name', name);
> return el;
> };
> }
>
> })();

Yes, I really like this version. It's nice and clean and runs the
check only once. Noted.

-David

(#7)

On Aug 24, 10:00 am, Brian Adkins <lojicdot...@gmail.com> wrote:
> var createElementWithName = (function () {
> try {
> var el = document.createElement('<div name="foo">');
> if (el.tagName !== 'DIV' || el.name !== 'foo') {
> throw 'create failed';
> }
> return function (tag, name) {
> return document.createElement('<' + tag + ' name="' + name +
> '"></' + tag + '>');
> };
> } catch (e) {
> return function (tag, name) {
> var el = document.createElement(tag);
> el.setAttribute('name', name);
> return el;
> };
> }
>
> })();

Oh, and you might want to take a look at Peter Michaux's lazy function
definition pattern - this could be a good use case for it:
http://peter.michaux.ca/article/3556

-David

(#8)

On Aug 25, 11:59 am, David Golightly <davig...@gmail.com> wrote:
> Oh, and you might want to take a look at Peter Michaux's lazy function
> definition pattern - this could be a good use case for it:http://peter.michaux.ca/article/3556
>
> -David

Interesting. I use solution #2 frequently. I appreciated solution #3 -
I hadn't thought of that. I'm unconvinced of the utility of solution
#4, but it's certainly clever