Geeks With Blogs
Geekette Mai Blog

We have to talk about About Object literals when mention DOM Nodes, because there more than one way to write any javarScript and can be reWritten in Object Literals:


var myDog = new Object ;
myDog.name = "Uno"  ;
myDog.breed = "Chihuahua" ;
myDog.website = "
http://www.akc.org/breeds/chihuahua/photos.cfm" ;


       function allaboutMyDog( );

            alert (" Can I tell you about my Dog? ") ;
   
            tellmemore = true ;

Where in Object literal format, that same code would be something like this:


var myDog =  {

    name = "Uno"  ,

    breed = "Chihuahua" ,

    website = "http://www.akc.org/breeds/chihuahua/photos.cfm" ,

    allabout : function ( ) {

         alert("Can I tell you about my Dog") ;
      
         tellMeMore = true;

       }

}


With either format, you can refer to a property of myDog as myDog.name ( for instance).  However with object literal format, the function becomes myDog.allAbout ( ) instead of allAboutMydog ( ).

At this point you're thinking that this look sort familar, pat yourself on the back--it's very similar in many ways, to CSS.  At its most basic level, it's a list of property and value pairs, which the colon in between and a seperater around each pair.

Object literals:

-Properties are set Using : not=.

-Lines end with , instead of ;.

-No comma needed on the last statement inside of the object

HTML Script:


 function nodeChanger()  {

  return ChgNodes.doAction( ) ;

}

  var ChgNodes = {
  
  ActionType : function ( ) {

 

  var radioButtonSet = document.GetElementByTagName ( "form" ) [ 0 ].nodeAction ;

     for (var i = 0 ; i <radioButtonSet.Lenght ; i ++ )  {

        if (radioButtonSet [ i ].checked )  {

            actionType = i ;

          }

}

        return - 1

},

   allGraft : Function ( ) {

     return this.nodeChgArea.getElementByTagName ( " p " ) ;

},


},

   allGraft : Function ( ) {

     return this.allGrafs ( ).length ;


},

   intext : function ( ) {

      return document.getElementById( " textArea " ).value

},

 

},

   newtext : function ( ) {

      return document.createTextNode(this.intext( ) ) ;


},

     graftChoice : function ( ) {

         return  document.getElementById ("grafCount".slectIndex ;

},
 
    newGraf : function ( ) {

      var myNewGraf = document.CreateElement( " p " ) ;

      myNewGraf.appendChild(this.newText( ) ) ;

      return  myNewGraf ;

},

 
},
 
    oldGraf : function ( ) {

    
      return  this.allGrafts( ).item(this.grafChoice ( ) );

},

    doAction : function ( ) {


       Switch ( actionType ( ) )  {

            case 0 :

                  this.nodeChgArea.appendChild( this.newgraf ( ) ) ;

                  break ;

              case 1 :

                  If (this.pGrafCt( ) > 0 )  {

                  this.nodeChgArea.removeChild( this.oldgraf ( ) ) ;

                   break ;

                  }


                 case 2 :

                  If (this.pGrafCt ( ) > 0 )  {

                 this.nodeChagArea.InsertBefore(this.newGraf ( ),this.oldGraf ( ) ) ;

                   break ;

                  }


                  case 3 :

                 
                  If (this.pGrafCt ( ) > 0 )  {

                 this.nodeChagArea.replaceChild(this.newGraf ( ),this.oldGraf ( ) ) ;

                   break ;

                  }

                default:

                 alert( "No valid action was chosent " ) ;

          }


             document.getElementById ( "grafCount " ).option.Lenght = 0 ;

             For ( var i= 0 i<this.pGrafCt ( ) ; i + + )  {


             document.getElementById ( " grafCount " ).option [ i ] = new Option ( i + 1)

             }

            return false ;


             }

             init  : function ( ) {

             this.nodeChgArea = document.getElementbyID( "DOM" ) ;

             }

}


Posted on Wednesday, February 17, 2010 3:14 PM | Back to top


Comments on this post: Object Literals

No comments posted yet.
Your comment:
 (will show your gravatar)


Copyright © Mai Nguyen | Powered by: GeeksWithBlogs.net