simple Javascript code - toggle function - please explain

Question

Can someone please explain this javascript. Maybe give comments for each line explaining how it works?

It works perfectly I would just like to know how it works.

Thanks

function toggleMe(a){
  var e =document.getElementById(a); 
  if(!e)return true;   
  if(e.style.display=="none"){ 
    e.style.display="block"
  } else {
    e.style.display="none"
  }
  return true;
}

Answer 1

function toggleMe(a){

    // Finds the element by the id you passed to the function
    var e =document.getElementById(a);

    // If it couldn't find the element it quits the function
    if(!e)return true;

    // If it did find the element
    // and the element is set to display: none (ie. hidden)
    if(e.style.display=="none"){

        // Toggle it to display: block
        e.style.display="block" 

    // else the element is visible 
    } else {

        // hide it
        e.style.display="none"

    } 

    // return true!
    return true; 
}

Answer 2

function toggleMe(a){ // define a function named toggleMe that takes an argument which will be in a
  var e =document.getElementById(a);  // find the element in the current document where id is the value in a
  if(!e)return true; // if there is no such element, return out with value true

  if(e.style.display=="none"){ // if the element found currently has style "display: none" (invisible)
  e.style.display="block" // then change it to block display
  } else { // otherwise
    e.style.display="none" // change it to none display (invisible)
  }
  return true; // return out with value true after that
}

Answer 3

function toggleMe(a){
    // a is the id of an element
    // get a reference to that element with getElementById
    var e =document.getElementById(a); 

    // if we didn't find the element get outta here (this should probably return false)
    if(!e)return true;

    // if the display property is 'none' the element is not visible, so show it
    if(e.style.display=="none"){
     e.style.display="block"
    }
    // otherwise it is visible, hide it
    else {
     e.style.display="none"
    }
    return true;
}

Answer 4

function toggleMe(a){
  var e =document.getElementById(a);
  //get the element in question for manipulation
  if(!e)return true;
  //check to see if the element exists - if not, exit the function.

if(e.style.display=="none"){
//check to see if the element is visible
  e.style.display="block"
//it's visible, make it invisible

  } else {
    e.style.display="none"
//it's visible, hide it.
  }
  return true;
}

Answer 5

function toggleMe(a)
{
    // Get the element from the DOM with the id as specified by the variable a
    var e =document.getElementById(a); 

    // if the element does not exist in the DOM then return true
    if(!e) 
        return true;

    // If the element is not being displayed (as specified by the css attribute 'display') then show it by setting the value to 'block' otherwise hide the element by setting the value to none.
    if(e.style.display=="none")
    {
        e.style.display="block"
    }
    else
    {
        e.style.display="none"
    }

    // If all goes well and the element is found and displayed or hidden then return true.
    return true;
}

Answer 6

function toggleMe(a){
  // create a function called toggleMe that takes a named parameter a.
  // since the function is not assigned to a variable, it is globally 
  // scoped and rests in the window object. (window.toggleMe)
  var e =document.getElementById(a);
  // grabs an element named a (therefore a should be a string) from the DOM and 
  // assigns it to the variable window.toggleMe.e
  if(!e)return true;  
  // check to see if e exists before continuing
  if(e.style.display=="none"){ 
  // check to see if e has the css property display:none
  e.style.display="block"
  // if it does, set it's display to block, so that it become visible.
  } else {
  // otherwise, make it invisible.
    e.style.display="none"
  }
  // exit... nothing special here.
  return true;
}

Answer 7

Thanks for the replies! Really helpful :)