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

lawrence

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

Subscribe Reply

3886

kaeli

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

lawrence

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

kaeli

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

Michael Winter

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

lawrence

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

Michael Winter

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

kaeli

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

Robert

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

Similar topics

12130

easy document.all.uss.style.visibility = visible; not working

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;

Javascript

1453

Syntax Problems with Function

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

Javascript

20927

document.getElementById comes out NULL help!

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

Javascript

5285

Border lines in hidden div bleed through into visible div

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:

Javascript

5459

Code works in Netscape 7.1 but not IE ---- document.getElementById('other').style.visibility='hidden';

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

Javascript

1709

DIVs don't appear in FireFox - any ideas?

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="";

HTML / CSS

9254

Help! document.getElementById("folderMenu").cells has no properties when using FireFox

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

Javascript

1918

A problem with an apparently common JS menu...

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

Javascript

6679

Javascript Style Properties for Dynamic Images in Safari

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

Javascript

7965

What is ONU?

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

General

8271

Problem With Comparison Operator <=> in G++

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

C / C++

8031

The easy way to turn off automatic updates for Windows 10/11

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,...

Windows Server

8258

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

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 protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...

General

5847

Access Europe - Using VBA to create a class based on a table - Wed 1 May

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

Microsoft Access / VBA

3881

Trying to create a lan-to-lan vpn between two differents networks

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

Networking - Hardware / Configuration

3923

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

2399

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp

1493

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP