473,703 Members | 2,294 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

I apparently don't get the syntax of document.getEle mentById(nameOf Div).style.visi bility='visible ';

The following function correctly makes everything invisible but then
fails to turn the one chosen DIV back to visible. I imagine I'm
getting the syntax of the variable wrong? I've tried this with both
single quotes and no single quotes, but it doesn't work either way.
What am I doing wrong?
<SCRIPT type='text/javascript'>
function makeVisible(nam eOfDiv) {
document.getEle mentById('weblo gs').style.visi bility='hidden' ;
document.getEle mentById('entri es').style.visi bility='hidden' ;
document.getEle mentById('newsl etters').style. visibility='hid den';
document.getEle mentById('image s').style.visib ility='hidden';
document.getEle mentById('files ').style.visibi lity='hidden';
document.getEle mentById('comme nts').style.vis ibility='hidden ';
document.getEle mentById('links ').style.visibi lity='hidden';
document.getEle mentById('membe rs').style.visi bility='hidden' ;
document.getEle mentById('desig n').style.visib ility='hidden';
document.getEle mentById('setti ngs').style.vis ibility='hidden ';
document.getEle mentById('categ ories').style.v isibility='hidd en';
document.getEle mentById('other ').style.visibi lity='hidden';
document.getEle mentById('onePa nel').style.vis ibility='hidden ';

document.getEle mentById(nameOf Div).style.visi bility='visible ';
}
</script>


<div id="options">
<a href="#"><img src="weblogs.gi f"
onClick="makeVi sible('weblogs' )"></a>
<a href="#"><img src="weblogEntr ies.gif"
onClick="makeVi sible('entries' )"></a>
<a href="#"><img src="webNewslet terPages.gif"
onClick="makeVi sible('newslett ers')"></a>
<a href="#"><img src="images.gif "
onClick="makeVi sible('images') "></a>
<a href="#"><img src="files.gif" onClick="makeVi sible('files')" ></a>
<a href="#"><img src="comments.g if"
onClick="makeVi sible('comments ')"></a>
<a href="#"><img src="links.gif" onClick="makeVi sible('links')" ></a>
<a href="#"><img src="categories .gif"
onClick="makeVi sible('categori es')"></a>
<a href="#"><img src="users.gif"
onClick="makeVi sible('members' )"></a>
<a href="#"><img src="design.gif "
onClick="makeVi sible('design') "></a>
<a href="#"><img src="settings.g if"
onClick="makeVi sible('settings ')"></a>
<a href="#"><img src="other.gif" onClick="makeVi sible('other')" ></a>
</div>
Jul 23 '05 #1
12 3934
In article <da************ **************@ posting.google. com>,
lk******@geocit ies.com enlightened us with...
The following function correctly makes everything invisible but then
fails to turn the one chosen DIV back to visible. I imagine I'm
getting the syntax of the variable wrong? I've tried this with both
single quotes and no single quotes, but it doesn't work either way.
What am I doing wrong?


You have a syntax error somewhere else in code you didn't post.

Because this works just fine.

<html>
<head>
<title> New Document </title>
<SCRIPT type='text/javascript'>
function makeVisible(nam eOfDiv) {
document.getEle mentById('weblo gs').style.visi bility='hidden' ;
document.getEle mentById('entri es').style.visi bility='hidden' ;

document.getEle mentById(nameOf Div).style.visi bility='visible ';
}
</script>
</head>

<body>
<div id="weblogs">we blogs</div>
<div id="entries">en tries</div>
<div id="options">
<a href="#"><img src="tile.jpg"
onClick="makeVi sible('weblogs' )"></a>
<a href="#"><img src="tile.jpg"
onClick="makeVi sible('entries' )"></a>
<p>&nbsp; </p>
</body>
</html>

--
--
~kaeli~
Black holes were created when God divided by 0.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #2
kaeli <ti******@NOSPA M.comcast.net> wrote in message news:<MP******* *************** **@nntp.lucent. com>...
You have a syntax error somewhere else in code you didn't post.

Because this works just fine.

<html>
<head>
<title> New Document </title>
<SCRIPT type='text/javascript'>
function makeVisible(nam eOfDiv) {
document.getEle mentById('weblo gs').style.visi bility='hidden' ;
document.getEle mentById('entri es').style.visi bility='hidden' ;

document.getEle mentById(nameOf Div).style.visi bility='visible ';
}
</script>
</head>

<body>
<div id="weblogs">we blogs</div>
<div id="entries">en tries</div>
<div id="options">
<a href="#"><img src="tile.jpg"
onClick="makeVi sible('weblogs' )"></a>
<a href="#"><img src="tile.jpg"
onClick="makeVi sible('entries' )"></a>
<p>&nbsp; </p>
</body>
</html>

Would it cause a syntax error if I reference a DIV that doesn't exist?
The code is dying on this line:
document.getEle mentById('onePa nel').style.vis ibility='hidden ';
This Javascript is included on every page, and on some pages there is
no element named "onePanel". Could that cause problems? How would I
test for "onePanel"?
Jul 23 '05 #3
Lee
lawrence said:
Would it cause a syntax error if I reference a DIV that doesn't exist?
The code is dying on this line:
document.getEle mentById('onePa nel').style.vis ibility='hidden ';
This Javascript is included on every page, and on some pages there is
no element named "onePanel". Could that cause problems? How would I
test for "onePanel"?


That wouldn't be a syntax error, but it would certainly be a run-time
error.
if(document.get ElementById('on ePanel')){
document.getEle mentById('onePa nel').style.vis ibility='hidden ';
}

Jul 23 '05 #4
In article <da************ **************@ posting.google. com>,
lk******@geocit ies.com enlightened us with...

Would it cause a syntax error if I reference a DIV that doesn't exist?
No, but it will be a runtime error that will stop processing.
The code is dying on this line:
document.getEle mentById('onePa nel').style.vis ibility='hidden ';
This Javascript is included on every page, and on some pages there is
no element named "onePanel". Could that cause problems? How would I
test for "onePanel"?


If objects may or may not exist, test for them. All of them.

You should also be checking if the browser even supports getElementById if
this is on the 'net. Also, not all browsers that support that also support
style. Older versions of Opera had problems with it, IIRC, and there are
countless browsers out there now that may or may not support it.

<SCRIPT type='text/javascript'>
function makeVisible(nam eOfDiv) {
if (document.getEl ementById) {
if (document.getEl ementById('webl ogs') &&
document.getEle mentById('weblo gs').style) {
document.getEle mentById('weblo gs').style.visi bility='hidden' ;
}
// and so on
}
}
</script>

--
--
~kaeli~
He often broke into song because he couldn't find the key.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #5
On Wed, 22 Sep 2004 15:00:20 -0500, kaeli <ti******@NOSPA M.comcast.net>
wrote:

[snip]
function makeVisible(nam eOfDiv) {
if (document.getEl ementById) {
if (document.getEl ementById('webl ogs') &&
document.getEle mentById('weblo gs').style) {
document.getEle mentById('weblo gs').style.visi bility='hidden' ;
}
// and so on
}
}


Or

/* Ensure that trying to obtain a reference is always meaningful.
* Note: That's not the same as always getting a reference.
*/
var getRefById = document.getEle mentById ?
function(n) {return document.getEle mentById(n);}
: document.all ?
function(n) {
/* Ensure that the document.all collection
* returns only one element and that it
* matches by id, not name.
*/
var e = document.all[n], l = e.length;
if('number' == typeof l) {
for(var i = 0; i < l; ++i) {
if(e[i].id == n) {return e[i];}
}
} else if(e.id == n) {return e;}
return null;
}
: function() {return null;};

function setVisibility(o , v) {
if(o) {(o.style || o).visibility = v;}
}

function makeVisible(id) {
setVisibility(g etRefById('webl ogs'), 'hidden');
// ...
setVisibility(g etRefById(id), 'visible');
}

Whilst it may look less efficient at first glance, the getRefById
assignment is a one-off cost. After that, getRefById and setVisibility
encapsulate the testing of properties and the change of style.

If you don't like that, at least save the return from the getElementById
call(s). Repeated look-ups are slower and produce larger code.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #6
kaeli <ti******@NOSPA M.comcast.net> wrote in message news:<MP******* *************** **@nntp.lucent. com>...
In article <da************ **************@ posting.google. com>,
lk******@geocit ies.com enlightened us with...

Would it cause a syntax error if I reference a DIV that doesn't exist?
No, but it will be a runtime error that will stop processing.


That's must be what's happening then.

If objects may or may not exist, test for them. All of them.

You should also be checking if the browser even supports getElementById if
this is on the 'net. Also, not all browsers that support that also support
style. Older versions of Opera had problems with it, IIRC, and there are
countless browsers out there now that may or may not support it.

<SCRIPT type='text/javascript'>
function makeVisible(nam eOfDiv) {
if (document.getEl ementById) {
if (document.getEl ementById('webl ogs') &&
document.getEle mentById('weblo gs').style) {
document.getEle mentById('weblo gs').style.visi bility='hidden' ;
}
// and so on
}
}
</script>


This is hot stuff. I wasn't sure how to test for things in Javascript
but it looks pretty simple. Using the dot notation, Javascript
apparently resolves the expression and sees if the result is true?
That's common enough in all languages, I guess, though I'm still
getting used to how flexible Javascript's dot notation is. Your line:

if (document.getEl ementById)

you're simply checking to see if document has the method
getElementById? That is awfully easy. In PHP I'd have to use
method_exists($ document, "getElementById "); I was wondering how to
do the same in Javascript.
Jul 23 '05 #7
On 22 Sep 2004 20:32:41 -0700, lawrence <lk******@geoci ties.com> wrote:

[snip]
Your [kaeli's] line:

if (document.getEl ementById)

you're simply checking to see if document has the method
getElementById? That is awfully easy. In PHP I'd have to use
method_exists($ document, "getElementById "); I was wondering how to
do the same in Javascript.


That's what's termed "feature detection". Take a look at section 4.26 of
the FAQ (and its links):

<URL:http://jibbering.com/faq/>

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #8
In article <da************ **************@ posting.google. com>,
lk******@geocit ies.com enlightened us with...

This is hot stuff. I wasn't sure how to test for things in Javascript
but it looks pretty simple.
It can be.
Using the dot notation, Javascript
apparently resolves the expression and sees if the result is true?
Well...not exactly.
It has something to do with how expressions are evaluated in JS for testing
in if/while/for statements. I can't explain it very well, but basically, I'm
testing for an object, and the object doesn't exist, so it's not defined (or
null or something) which is comparable to false. JS does the conversion from
what it really is to the equivalent of false. (or true, as the case may be)
Someone else explained it WAY better (and probably more accurate) than that
some time ago on this list.
That's common enough in all languages, I guess, though I'm still
getting used to how flexible Javascript's dot notation is. Your line:

if (document.getEl ementById)

you're simply checking to see if document has the method
getElementById?


Close enough.
I know it's actually a little more complicated than that, but I suck at
explaining things. I'm good at applying things, but I am really bad at
explaining why they work. *LOL*

This has a blurb.
http://jibbering.com/faq/#FAQ4_26

If you'd like more explained about it, post a new question and maybe one of
the more eloquent gurus will see it. :p

--
--
~kaeli~
Synonym: the word you use in place of a word you can't
spell.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #9
In article <da************ **************@ posting.google. com>,
lk******@geocit ies.com (lawrence) wrote:
if (document.getEl ementById)

you're simply checking to see if document has the method
getElementById?


Everything is a variable in Javascript. Yes, this includes functions.

At least this is how I currently think of things.

Robert
Jul 23 '05 #10

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

Similar topics

3
12146
by: Québec | last post by:
Hi, I went on Honnen FAQ and tried other solutions. This is suppose to be easy? Is one of theese suppose to work on IE6? uss.visibility = visible; uss.style.visibility = visible; document.all.uss.style.visibility = visible; document.getElementById('uss').style.visibility = visible;
2
1462
by: Steve Bishop | last post by:
I am trying to check for a fields value on load and hide certian controls based on it's value. I am having trouble with the "else" statement and the bracket placement. Help appreciated. Here is the code: <HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> function HideTable(){ var myform1 = document.form1 var myform2 = document.form2 if (myform1.txtName1.value == "Size Mix")
2
20935
by: Gary Mayor | last post by:
Hi, I'm back again. Basically i'm trying to draw a box over an image which is turning out to be a nightmare. The problem i'm getting at the moment is that i'm creating a line with <div which works when it's not hidden but I need to be able to make it hidden so I can use layers to show all when it finished drawing to make it smoother. This is how some other scripts are doing it that i've seen. So i've got it drawing a line and I need...
2
5290
by: Jon | last post by:
Hi all, I am trying to create a page that contains a number of div elements, with links on the left side of the page allowing the user to select which div to display. Some of the pages contain tables with border styles used to block off the columns and the headers, but not the individual rows. The pages will be displayed using IE 5.5 and later in the finished app. Now to the problem, which is a little awkward to describe:
4
5476
by: lawrence | last post by:
Can anyone tell me why this code works in Netscape 7.1 but not in IE??? <SCRIPT type='text/javascript'> function makeVisible(nameOfDiv) { document.getElementById(nameOfDiv).style.visibility='visible'; document.getElementById(nameOfDiv).style.height='auto'; if (nameOfDiv != 'weblogs')
4
1711
by: Gregor | last post by:
I am trying to use an image map with a mouseover function to show various DIV tags. I am not an expert, but what I've come up with works in IE but not in FireFox. Any insight would be greatly appreciated. Below is the js and CSS code <SCRIPT TYPE="text/javascript"> <!-- var layerRef="",styleSwitch="",curMenu="";
3
9267
by: davidkarlsson74 | last post by:
Error: document.getElementById("folderMenu").cells has no properties File: http://www.volkswagen.se/tillbehor/js/foldermenu.js Rad: 49 The function activates different DIV:s, but doesn't seem to work on FireFox or Netscape. What could be wrong? The function: function setActiveTab(tabNo) {
14
1933
by: Bryan | last post by:
I am attempting to make a web page more Netscape friendly... <a href="http:www.gordonceilings.com"></a> I have already corrected the table issues in an offline staging site (where I do the building and then move it to the live site when ready), so don't worry about those. My problem lies in the menu on the left. It shows up and the initial links work in Netscape 8, but the menu will not drop down to show the sub-selections. I can get the...
3
6692
by: Joe Cox | last post by:
I am having a problem with style properties for dynamic images in Mac OS X Safari. By dymanic images, I mean images allocated with the javascript 'new Image()' call. With static images (created with the html <img> tag), I can make the image visible or not, i.e. '<img style="visibility='hidden'" src='xxxx'/>'. But if I create the image dynamically with javascript: new Image() then try to modify the style, Safari chokes, and the Debug...
0
8750
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
8662
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 effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
9244
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
1
9004
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
1
6585
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
4421
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
4679
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
2
2439
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2058
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

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.