HTML and DOM objects 1

timgerr · Nov 13, 2007

Hey all, here is a question that I have. I have a text input

Code:

<input type="text" id="textOne">

I am able to access all the elements with dom

Code:

 alert(document.getElementById('textOne).value);

Lets say I want to add more (of my own) information into the html object, something like this:

Code:

<input type="text" id="testTwo" serial="123456">

I am not able to use the DOM to do this

Code:

 alert(document.getElementById('textTwo).serial);

This will returns undefined, can I add extra html elements and access them with DOM?

Thanks,
timgerr

-How important does a person have to be before they are considered assassinated instead of just murdered?
-Need more cow bell!!!

vacunita · Nov 13, 2007

Nope. you cannot arbitrarily define more attributes for html elements. if you need to have more info on the element, use attributes that are already defined, or hidden elements.

You can use the title attribute, although that's not exactly what its meant for.

<input type=text ... title="12345">

----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

j4606 · Nov 13, 2007

In ie this might work. I forgot what exactly how cause it has been a while but I remember an ie app working and using the method you described.

Where by you could say

Code:

<span myattrbute="siomthing>test</span>

and it was referred to using document.span.mayattribute.
When we converted the application to work for firefox we had to use getters and setters. So instead of changing the whole codebase I had to make firefox behave like ie.

j4606 · Nov 13, 2007

http://www.codeproject.com/jscript/...sp?df=100&forumid=245519&exp=0&select=1313213

here you go this a pretty old but decent article on the subject.

j4606 · Nov 13, 2007

and finally a quick example

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script type="text/javascript">
HTMLElement.prototype.__defineGetter__("myattribute", function() { return this.getAttribute("myattribute"); });

function getMyAttribute() {
	alert(document.getElementById("divId").myattribute);
}

</script>
<style type="text/css">

#divId{
	background:#EEEEEE;
	position: absolute;
}

</style>
</head>
<body>
<button onclick="getMyAttribute()">get myattribute</button>
<div id="divId" myattribute="test">

</div>

</body>
</html>

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

HTML and DOM objects 1

timgerr

IS-IT--Management

vacunita

Programmer

j4606

MIS

j4606

MIS

j4606

MIS

Similar threads

Part and Inventory Search

Sponsor