how to set attribute "name"

D

Ding

Hi, this is my code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function showhtml() {
var divElement = document.createElement("div");
var elem = document.createElement("input");
elem.id="I001_ID_CHANGE";
elem.name="I001_NAME_CHANGE";
//elem.className="aaa";
document.getElementById("TA001").value="ID: " + elem.id + "\nName: "
+ elem.name;
divElement.appendChild(elem);
document.getElementById("TA002").value=divElement.innerHTML;
}
//-->
</SCRIPT>
</HEAD>

<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
 
R

RobG

IE chokes on setting the "name" attribute of an element that's already
in the DOM. See:http://msdn.microsoft.com/library/default.asp?url=/workshop/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).
 
B

Brian Adkins

IE chokes on setting the "name" attribute of an element that's already
in the DOM. See:http://msdn.microsoft.com/library/default.asp?url=/workshop/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;
};
}
})();
 
D

David Golightly

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
 
D

David Golightly

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
 
B

Brian Adkins

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 :)
 

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,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top