473,395 Members | 2,446 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,395 software developers and data experts.

element not defined when using "createElement"

Hi,

Using advice from this newsgroup, I tried this JS to create new DOM
elements on-the-fly

var divSidebarItem =
document.createElement("div");
divSideBarItem.setAttribute("class",
"sidebarToDo");

but I get a JS error on the second line "divSideBarItem" is not
defined when I try and invoke the "setAttribute" method. Is there a
better way to create an element with attributes or is there something
wrong with the above?

Thanks, - Dave

Feb 21 '07 #1
7 11086
"la***********@zipmail.com" <la***********@zipmail.comwrote in
news:11**********************@q2g2000cwa.googlegro ups.com:
Hi,

Using advice from this newsgroup, I tried this JS to create new DOM
elements on-the-fly

var divSidebarItem =
document.createElement("div");
divSideBarItem.setAttribute("class",
"sidebarToDo");

but I get a JS error on the second line "divSideBarItem" is not
defined when I try and invoke the "setAttribute" method. Is there a
better way to create an element with attributes or is there something
wrong with the above?
divSidebarItem isn't an element/node. you've defined it as a command to
CREATE an element.

Feb 21 '07 #2
la***********@zipmail.com wrote on 21 feb 2007 in comp.lang.javascript:
Hi,

Using advice from this newsgroup, I tried this JS to create new DOM
elements on-the-fly

var divSidebarItem =
document.createElement("div");
divSideBarItem.setAttribute("class",
"sidebarToDo");

'divSidebarItem' != 'divSideBarItem'

Wath your cases!
but I get a JS error on the second line "divSideBarItem" is not
defined when I try and invoke the "setAttribute" method. Is there a
better way to create an element with attributes or is there something
wrong with the above?

Thanks, - Dave


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Feb 21 '07 #3
Good Man wrote on 21 feb 2007 in comp.lang.javascript:
"la***********@zipmail.com" <la***********@zipmail.comwrote in
news:11**********************@q2g2000cwa.googlegro ups.com:
>Hi,

Using advice from this newsgroup, I tried this JS to create new DOM
elements on-the-fly

var divSidebarItem =
document.createElement("div");
divSideBarItem.setAttribute("class",
"sidebarToDo");

but I get a JS error on the second line "divSideBarItem" is not
defined when I try and invoke the "setAttribute" method. Is there a
better way to create an element with attributes or is there something
wrong with the above?

divSidebarItem isn't an element/node. you've defined it as a command to
CREATE an element.
No, that is not the error, see my other post.
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Feb 21 '07 #4
"Evertjan." <ex**************@interxnl.netwrote in
news:Xn********************@194.109.133.242:
>divSidebarItem isn't an element/node. you've defined it as a command to
CREATE an element.

No, that is not the error, see my other post.
hmm, good eyes.

is the case change all that is necessary for this to work? Does
"divSideBarItem" become a reference to the created DIV instead of the
command to create the DIV?

thanks...

Feb 21 '07 #5
Good Man wrote on 21 feb 2007 in comp.lang.javascript:
"Evertjan." <ex**************@interxnl.netwrote in
news:Xn********************@194.109.133.242:
>>divSidebarItem isn't an element/node. you've defined it as a command
to CREATE an element.

No, that is not the error, see my other post.

hmm, good eyes.

is the case change all that is necessary for this to work? Does
"divSideBarItem" become a reference to the created DIV instead of the
command to create the DIV?
Another Q, my good man!

Mind:

When setting the CLASS attribute using this method, set the sName to be
"className", which is the corresponding Dynamic HTML (DHTML) property.
<http://msdn.microsoft.com/workshop/a...thods/setattri
bute.asp>

Try this:

=================================

<style type='text/css'>
..sbiStyle {color:red;}
</style>

<div id=d>This is div "d"</div>

<script type='text/javascript'>

var sbi = document.createElement('div');
sbi.setAttribute('className','sbiStyle');

var d = document.getElementById('d');
document.body.insertBefore(sbi, d);

sbi.innerHTML = '<h1>This is the "sbi"</h1>';

</script>

=================================
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Feb 21 '07 #6
On Feb 21, 9:50 am, "laredotorn...@zipmail.com"
<laredotorn...@zipmail.comwrote:
>
var divSidebarItem = document.createElement("div");
divSideBarItem.setAttribute("class", "sidebarToDo");

but I get a JS error on the second line "divSideBarItem" is not
defined when I try and invoke the "setAttribute" method. Is there a
better way to create an element with attributes or is there something
wrong with the above?
Look carefully, Dave.

divSide b arItem
divSide B arItem

JS is case-sensitive. The B in SideBar is capitalized on the second
line, but not on the first. divSideBarItem is not defined--
divSidebarItem is.

:)

--
Isaac Z. Schlueter
http://isaacschlueter.com

Feb 23 '07 #7
On Feb 22, 4:25 am, Good Man <h...@letsgo.comwrote:
"Evertjan." <exjxw.hannivo...@interxnl.netwrote innews:Xn********************@194.109.133.242:
divSidebarItem isn't an element/node. you've defined it as a command to
CREATE an element.
No, that is not the error, see my other post.

hmm, good eyes.

is the case change all that is necessary for this to work? Does
"divSideBarItem" become a reference to the created DIV instead of the
command to create the DIV?
When the call operataor () follows an identifier, javascript will
attempt to execute the object referenced by the identifier. The
return value of executing the function is returned, so:

var aDiv = document.createElement('div');

assigns the result of executing the right hand side to the identifier
on the left. Simply doing:

document.createElement('div');

will create a div and return a reference to it. Since that reference
isn't assigned to anything, the div will immediately become available
for garbage collection and effectively ceases to exist almost from the
instant of its creation.
--
Rob

Feb 23 '07 #8

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: MiW | last post by:
Hi I'm making a kind of JavaScript-based library for creating SVG objects/elements. And I hit the wall... Every element (rect, circle etc.) can be created using *.createElement, then...
5
by: NeilL | last post by:
In the XML document I'm trying to create I do the following elem = _doc.CreateElement("Author"); elem.InnerText = "something"; parentElem.AppendChild(elem); Thiw works properly however the...
4
by: millw0rm | last post by:
Hi wats wrng with this code??? it works fine on IE6 but not on FireFox 1.5??? var anOption = document.createElement("OPTION"); document.getElementById("category").options.add(anOption);...
7
by: christian | last post by:
hi there! i've the following piece of html: <div id="tbl"></div> and i'm trying to create an object with the following javascript code: var objDiv = document.getElementById("tbl"); var...
1
by: k386 | last post by:
I am having trouble creating a hidden form field, or least having it accessible from getElementById. Rough overview: I am reading an XML file through XMLhttpRequest and outputting each item...
2
by: goodevilgenius | last post by:
I have a script that should insert a youtube video into the page. But when I ran it, the video wouldn't show up. (The script inserts a number of things, and the video was the only thing not to...
6
by: Amzul | last post by:
hello all i did this table useing createElement(); i am trying to insert html code to the <td> to put img and links but so far no luck any one have an idea on how it shouled b done? the...
4
by: tswaters | last post by:
Alright, so generally I'm using document.createElement("IMG").... but, I've noticed something just recently that made me switch to "new Image()" What I'm doing is creating a photo gallery of...
7
by: r_ahimsa_m | last post by:
Hello, I am learning JavaScript. I have a table on HTML page:                 <table id="announcement_fields" border="0">                 <tbody>                 <tr>...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.