Show a div only if it has content

[toxicpaint]

Hi Guys,

I've found a few scripts to hide a div when a button is clicked, but these aren't quite what I'm looking for.

I'm using adobe contribute to update my site and therefore I need to have a downloads box (a simple div with just a non-breaking space character in). What I'd like to happen is to have this on every page by default and have a little script test it. If the box has a non-breaking space in, hide it, if it has anything else in, show it.

This way if there isn't a download on the page in question, the box doesn't get shown. If there is one, it does..

Cheers,

Tom

[acoder]

This would probably be better done using the server-side language during page load rather than after the page has loaded.

If you still want to use JavaScript, check the div's innerHTML property or DOM firstChild... property

[toxicpaint]

This would probably be better done using the server-side language during page load rather than after the page has loaded.

If you still want to use JavaScript, check the div's innerHTML property or DOM firstChild... property

Thanks for the reply.

I would use asp or aspx, but they are disabled on the server.. =/

Do you have any tutorials on checking the innerHTML content, please?

[acoder]

innerHTML is only a string, so just compare against " ":

// 'div' is reference to the div
if (div.innerHTML == " ") {
  // hide...
}

[toxicpaint]

innerHTML is only a string, so just compare against " ":

// 'div' is reference to the div
if (div.innerHTML == " ") {
  // hide...
}

Sounds like the right route to go down, but I can't seem to get it to work..

Here's what I've got:

<div id="downloadbox">&nbsp;</div>
<script language=javascript>
if (downloadbox.innerHTML == "&nbsp;") {
alert("sometext");
}

[toxicpaint]

Ah. I had the doctype as Strict..

[acoder]

Keep it as strict, but use document.getEle mentById() to access elements rather than access them directly by ID.

[toxicpaint]

Fantastic. Works a treat. :D

Solution:

<script language="javascript">
function changeclass()
{document.getElementById("downloadbox").className="hidden"; }
if (document.getElementById("downloadbox").innerHTML == "&nbsp;") {
changeclass();
}
</script>

[acoder]

Glad you got it working :)

Just a tip: the script language attribute is deprecated in favour of the type attribute which should be set to "text/javascript".

PS. please remember to use [code] tags when posting code. Thanks.

[toxicpaint]

Glad you got it working :)

Just a tip: the script language attribute is deprecated in favour of the type attribute which should be set to "text/javascript".

PS. please remember to use [code] tags when posting code. Thanks.

Thanks for the tips. Will do!