JavaScript DOM advanced programming 2.4-try{}catch{}-- I will persist!

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Look at the period of abnormal statement

var sound = 'Roar!';
function myOrneryBeast() {'green';//Window has no style property

Accession to the try{}catch{}

var sound='Roar';
function myOrneryBeast()
catch (theException)
    alert('Oops,we caught an exception Name:'

Application: your debug log

Usually, when we debug JS are generally use alert but, when for example met for (I in document) {alert (I);} this situation, is indeed a headache, used all know. I do, and he also similar, add similar features in our ADS library, similar to the for (I in document) {ADS.log.write (I);}, following it, we began to complete this function.

The myLogger object

function myLogger(id)
    var logWindow=null;//In the internal object to reference the DOM node log window
    var createWindow=function(){};//You can create logWindow node in the DOM tree with this method
    this.writeRaw=function(message){};//Privilege for add one day record to the log window

    //Speaking in front of, defined by a literal syntax
    write:function(message){};//The most frequently used in the log has method. 
    //He will be in the message brackets are encoded and displays the HTML source code in the log window, the method will eventually message string encoded passed to the writeRaw () method
    header.function(message){};//Add bold to log window, red item titles

    //But the use of literal not redundant: for example, add a link method
//The above code can also be defined as follows
//header.prototype.write=function(message){};//This local rookie do not understand one thing, why not use//myLoger.prototype.header=function(message){};
//{};//Well, it may be because the printing error
if (!window.ADS){window['ADS']={};}
window['ADS']['log']=new myLogger();

The following specific analysis of each method


//Create a protected method creates a log window
    //New window in your browser
    //The angular position when placed to the left.
    var browserWindowSize=ADS.getBrowserWindowSize();//Methods of the ADS library. You can see the source code, will be posted
    var top=((browserWindowSize.height-200)/2)||0;
    var left=((browserWindowSize.width-200)/2)||0;
    //Create a Dom node log window
    //Use the logWindow property protected maintenance reference

    //The specified ID value, if necessary in the DOM tree can recognize him

    //Center log window on the screen'absolute';'px';'scroll';

    //Add some style, with plum appearance'0';'0';'1px solid black';'white';'none';'10px/10px Verdana , Tahoma,Sans';

    //Add it to the document body.


function getBrowserWindowSize()
    var de = document.documentElement;


    //If the initial window does not exist. You create it
    if (!logWindow)
    //Create a list of appropriate to add style to the soldiers
    var li  = document.createElement('LI');'2px';'0';'1 px dotted black';'0';'#000';'9px/9px Verdana ,Tahoma,Sans';//In fact, rookie did not know what is the meaning of this writing
    //Later in the article mentioned, this embedding style is not a good way. 
    //Add information to the log node
    if (typeof message='undefined')
        li.appendchild(document.createTextNode('Message was undefined'))
    }else if (typeof li.innerHTML!=undefined)

    //The entries to the log window
    return true;


When we run the ADS.log.writeRaw ('This is raw.') and ADS.log.writeRaw ('<  strong> This; </strong> is bold!'); the browser will display the middle:

Finally, in order to create a common write () and head () method, to put the following code added to the myLogger object prototype.

        //Warning message is null
        if (typeof message=='string' && message.length==0)
            return this.writeRaw('ADS.log:null message');
        //If message is not a string, is trying to call toString () method, if not the access record object types
        if ( typeof message!='string')
            if (message.toString)
                return this.writeRaw(message.toString());
                return this.writeRaw(typeof message);

        //Conversion of < to innerHTML; and > message would not be as THML analysis
        message=message.replace(/</g,"&lt;").replace(/>/g,"&gt;");//Here, /g is what mean. . . 
        return this.writeRaw(message);

        //Write a title to log window
            message='<span style="color:white;background-color:black;font-weight:bold;padding:0px 5px;">'
            return this.writeRaw(message);

Well, the whole case was done

There is a doubt, this source is how to upload the rookie, never used, looking for a long time did not find..... Will be to ask to go. . .

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download

Posted by Hunk at November 15, 2013 - 3:30 AM