By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
434,720 Members | 2,157 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 434,720 IT Pros & Developers. It's quick & easy.

Can this be written in a more efficient way

P: n/a
Hi

I've managed to figure out how to write some code which acts to
show/hide sections of a web page. The code is below:

function showreimburse(){
document.getElementById("reimburse").style.display ="block";
}
function hidereimburse(){
document.getElementById("reimburse").style.display ="none";
}
function showreimburselength(){
document.getElementById("reimburselength").style.d isplay="block";
}
function hidereimburselength(){
document.getElementById("reimburselength").style.d isplay="none";
}
function showq2b(){
document.getElementById("q2b").style.display="bloc k";
}
function hideq2b(){
document.getElementById("q2b").style.display="none ";
}
function showwhere(){
document.getElementById("where").style.display="bl ock";
}
function hidewhere(){
document.getElementById("where").style.display="no ne";
}
function showquestion3a(){
document.getElementById("question3a").style.displa y="block";
}
function hidequestion3a(){
document.getElementById("question3a").style.displa y="none";
}

which I trigger in the web page with this sort of thing. All fine so
far. However is it possible to write the javascript in a more
effiecient manner.

Thanks for reading.

Alex

Jan 18 '06 #1
Share this Question
Share on Google+
4 Replies


P: n/a
What about this?

function hideSomething (what, whatTo) {
var obj = document.getElementById(what);
if(obj === null) return;
obj.style.display = whatTo;
}

Then call...

hideSomething("question3a", "none");

Jan 18 '06 #2

P: n/a
Ronaldo Junior wrote on 18 jan 2006 in comp.lang.javascript:
What about this?

function hideSomething (what, whatTo) {
var obj = document.getElementById(what);
if(obj === null) return;
obj.style.display = whatTo;
}

Then call...

hideSomething("question3a", "none");


That is less efficient tha the loop solutions,
where the whole point of testing was ending
the series of available divs.

And your function can be simplified:

function hideSomething(whatID, whatTo) {
var obj = document.getElementById(whatID);
if (obj) obj.style.display = whatTo;
}

Or even more so:

function hideSomething(whatID, whatTo) {
if (obj = document.getElementById(whatID))
obj.style.display = whatTo;
}


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Jan 18 '06 #3

P: n/a
On 2006-01-18, alex_NOSPAM_BILLEREY@HOTMAILDOTCOM <al***********@hotmail.com> wrote:
Hi

I've managed to figure out how to write some code which acts to
show/hide sections of a web page. The code is below:

function showreimburse(){
document.getElementById("reimburse").style.display ="block";
} (10+ similar skipped)

which I trigger in the web page with this sort of thing. All fine so
far. However is it possible to write the javascript in a more
effiecient manner.

function show(a){
document.getElementById(a).style.display="block";
}
function hide(a){
document.getElementById(a).style.display="none";
}
then when you need them do

show('question3a');

or

hide('where');

etc.

show might be betted done as

function show(a){
document.getElementById(a).style.display="";
}

in-case you want to (un)hide inline elements...

Bye.
Jasen
Jan 19 '06 #4

P: n/a
JRS: In article <11**********************@g44g2000cwa.googlegroups .com>
, dated Wed, 18 Jan 2006 09:42:03 remote, seen in
news:comp.lang.javascript, alex_NOSPAM_BILLEREY@HOTMAILDOTCOM
<al***********@hotmail.com> posted :
[similar] ... function showquestion3a(){
document.getElementById("question3a").style.displ ay="block";
}
function hidequestion3a(){
document.getElementById("question3a").style.displ ay="none";
}

which I trigger in the web page with this sort of thing. All fine so
far. However is it possible to write the javascript in a more
effiecient manner.


YSCIB. Yes.

Evidently (at least typically) the argument to
document.getElementById("question3a")
is a constant; and the call is made at least twice and maybe more often.
Now getElementById is a searching operation, and takes time, especially
on a large page.

You could write those functions as

var gIDQ3A = document.getElementById("question3a")

function showquestion3a() { gIDQ3A.style.display="block" }
function hidequestion3a() { gIDQ3A.style.display="none" }

and perhaps move .style as well. There ought to be a way of getting a
"pointer" to gIDQ3A.style.display itself; but I don't know of one.

Never perform a given lookup many times if it can easily enough be
avoided.

And now the content of the functions is sufficiently simple that it can
reasonably be written in-line, saving the overhead of a function call.
OTOH, the time taken by simple code that affects the appearance of the
screen will be dominated by screen-handling.

OTTH, the screen should be rendered only once for each set of calls.

--
John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 IE 4
<URL:http://www.jibbering.com/faq/> JL/RC: FAQ of news:comp.lang.javascript
<URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
Jan 19 '06 #5

This discussion thread is closed

Replies have been disabled for this discussion.