Question

This javascript works fine.it does what I want it to do. it puts a boarder around a table etc. but I am still getting an error in the firefox console saying that addressTable, AddressSpan AddressShort… are null or not defined. everything seems to be working but the error at the bottom of the screen is annoying I don’t want to see it there

Error

document.getElementById(“addressTable”)
is null [Break On This Error]
document.getElementById(“addressTable”).style.borderStyle=”solid”;

Script

<script language="javascript" type="text/javascript">
var isDroppedDown= 0 ;
function dropDown(){
        var myTable = document.getElementById("bgImgBlue");
        var sideImage = document.getElementById("sideImage");


        parent.document.getElementById('frameMain').rows = '173,*';
        isDroppedDown = 1;
        myTable.height = 100;
        sideImage.height = 100;
        document.getElementById("bgImgBlue").style.backgroundImage="url('images/i_frame_bgnavBig.gif')";
        document.getElementById("sideImage").height = 172;
        document.getElementById("addressTable").style.borderStyle="solid";
        document.getElementById("addressTable").style.borderWidth="1px";
        document.getElementById("addressSpan").style.paddingTop="";
        document.getElementById("addressShort").style.visibility = 'hidden';
        document.getElementById("ContactSpanFull").style.paddingTop="";
        document.getElementById("ContactSpan").style.paddingTop="";
        document.getElementById("ContactSpan").style.visibility = 'hidden'
        document.getElementById("contactTable").style.borderStyle="solid";
        document.getElementById("contactTable").style.borderWidth="1px";
 }

 function dropDownUp(){
        var myTable = document.getElementById("bgImgBlue");
        var sideImage = document.getElementById("sideImage");

        parent.document.getElementById('frameMain').rows = '84,*';
        isDroppedDown = 0;
        myTable.height = 84;
        sideImage.height = 160;
        document.getElementById("bgImgBlue").style.backgroundImage="url('images/i_frame_bgnav.gif')";
        document.getElementById("bgImgBlue").style.backgroundImage="url('images/i_frame_bgnav.gif')";
        document.getElementById("sideImage").height = 79;
        document.getElementById("addressTable").style.borderStyle="";
        document.getElementById("addressTable").style.borderWidth="";
        document.getElementById("addressSpan").style.paddingTop="30px";
        document.getElementById("addressShort").style.visibility = 'visible';
        document.getElementById("ContactSpan").style.visibility = 'visible'
        document.getElementById("ContactSpanFull").style.paddingTop="30px";
        document.getElementById("contactTable").style.borderWidth="0px";
 }

function dropdownResize(){

    if(isDroppedDown == 0){     
        dropDown();
    }
    else{
        dropDownUp();
        }
}


</script>

Answer 1

This javascript might be executing before the DOM is ready – that is – before the page has finished loading the HTML.

If that’s the case it won’t find any of the getElementById items.. however, if you’re only getting the error on those elements, the likely explanation is that they haven’t been placed in the DOM at the time of execution.

Or they don’t exist