JavaScript DHTML/Development/Debug
Содержание
Debug function
<source lang="html4strict">
/* Examples From JavaScript: The Definitive Guide, Fourth Edition Legal matters: these files were created by David Flanagan, and are Copyright (c) 2001 by David Flanagan. You may use, study, modify, and distribute them for any purpose. Please note that these examples are provided "as-is" and come with no warranty of any kind. David Flanagan
- /
<html> <script> var _console = null; function debug(msg) {
// Open a window the first time we are called, or after an existing
// console window has been closed.
if ((_console == null) || (_console.closed)) {
_console = window.open("","console","width=600,height=300,resizable");
// Open a document in the window to display plain text.
_console.document.open("text/plain");
}
_console.focus(); // Make the window visible
_console.document.writeln(msg); // Output the message to it
// Note that we purposely do not call close(). By leaving the
// document open we are able to append to it later.
} </script>
<script>var n = 0;</script> <form> <input type="button" value="Push Me"
onclick="debug("You have pushed me:\t" + ++n + " times.");">
</html>
</source>
debug function displays plain-text debugging messages
<source lang="html4strict">
/* Examples From JavaScript: The Definitive Guide, Fourth Edition Legal matters: these files were created by David Flanagan, and are Copyright (c) 2001 by David Flanagan. You may use, study, modify, and distribute them for any purpose. Please note that these examples are provided "as-is" and come with no warranty of any kind. David Flanagan
- /
/**
* This debug function displays plain-text debugging messages in a * special box at the end of a document. It is a useful alternative * to using alert() to display debugging messages. **/
function debug(msg) {
// If we haven"t already created a box within which to display
// our debugging messages, then do so now. Note that to avoid
// using another global variable, we store the box node as a property
// of this function.
if (!debug.box) {
// Create a new debug.box = document.createElement("div");
// Specify what it looks like using CSS style attributes
debug.box.setAttribute("style",
"background-color: white; " +
"font-family: monospace; " +
"border: solid black 3px; " +
"padding: 10px;");
// And append our new document.body.appendChild(debug.box);// Now add a title to our
// used to parse a fragment of HTML and insert it into the document.
// innerHTML is not part of the W3C DOM standard, but it is supported
// by Netscape 6 and Internet Explorer 4 and later. We can avoid
// the use of innerHTML by explicitly creating the element, // setting its style attribute, adding a Text node to it, and // inserting it into the document, but this is a nice shortcut debug.box.innerHTML = "<h1 style="text-align:center">Debugging Output
";}// When we get here, debug.box refers to a
// we can insert our debugging message.// First, create a
node to hold the message var p = document.createElement("p"); // Now create a text node containing the message, and add it to the <p> p.appendChild(document.createTextNode(msg)); // And append the <p> node to the
debug.box.appendChild(p);
}
</source>
Debugging Using alert() Methods "html"
<source lang="html4strict">
<html> <body> <script language="JavaScript"> var myVariable; var yourVariable;
function setType() {
alert("Inside the setType function."); //Debug statement
return(yourVariable="truck");
}
function setColor() {
alert("Inside the setColor function."); //Debug statement
return(myVariable="blue");
}
//Debug statement alert("Before if statement: type="+yourVariable+" color="+myVariable);
if(setType() || setColor()) {
//Debug statement
alert("After if statement: type="+yourVariable+" color="+myVariable);
document.write("The " + yourVariable + " is " + myVariable);
} else
alert("The vehicles could not be set");
</script>
</body> </html>
</source>
Handle error
<source lang="html4strict">
/* Examples From JavaScript: The Definitive Guide, Fourth Edition Legal matters: these files were created by David Flanagan, and are Copyright (c) 2001 by David Flanagan. You may use, study, modify, and distribute them for any purpose. Please note that these examples are provided "as-is" and come with no warranty of any kind. David Flanagan
- /
<html> <body> <script> // A variable we use to ensure that each error window we create is unique. var error_count = 0; // Set this variable to your email address. var email = "myname@mydomain.ru"; // Define the error handler. It generates an HTML form so // the user can report the error to the author. function report_error(msg, url, line) {
var w = window.open("", // URL (none specified)
"error"+error_count++, // Name (force it to be unique)
"resizable,status,width=625,height=400"); // Features
// Get the document object of the new window.
var d = w.document;
// Output an HTML document, including a form, into the new window.
// Note that we omit the optional call to Document.open()
d.write(" d.write("");
d.write("OOPS.... A JavaScript Error Has Occurred!");
d.write("");
d.write("<form action="mailto:" + email + "" method=post");
d.write(" enctype="text/plain">");
d.write("");
d.write("Click the "Report Error" button to send a bug report.
");
d.write("<input type="submit" value="Report Error"> ");
d.write("<input type="button" value="Dismiss" onclick="self.close();">");
d.write("</div> d.write("
Your name (optional): ");
d.write("<input size="42" name="name" value="">");
d.write("
Error Message: ");
d.write("<input size="42" name="message" value="" + msg + "">");
d.write("
Document: <input size="42" name="url" value="" + url + "">");
d.write("
Line Number: <input size="42" name="line" value=""+line +"">");
d.write("
Browser Version: ");
d.write("<input size="42" name="version" value=""+navigator.userAgent+"">");
d.write(" d.write("</form>");
// Remember to close the document when we"re done.
d.close();
// Return true from this error handler, so that JavaScript does not
// display its own error dialog.
return true;
} // Before the event handler can take effect, we have to register it // for a particular window. self.onerror = report_error; </script> <script> // The following line of code purposely causes an error as a test. alert(no_such_variable); </script> </body> </html>
</source>