JavaScript DHTML/Development/Debug — различия между версиями
Admin (обсуждение | вклад) м (1 версия) |
|
(нет различий)
| |
Версия 10:02, 26 мая 2010
Содержание
Debug function
/*
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>
<!-- Here"s an example of using this script. -->
<script>var n = 0;</script>
<form>
<input type="button" value="Push Me"
onclick="debug("You have pushed me:\t" + ++n + " times.");">
</html>
debug function displays plain-text debugging messages
/*
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 <div> element
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 <div> element to the end of the document
document.body.appendChild(debug.box);
// Now add a title to our <div>. Note that the innerHTML property is
// 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 <h1> 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</h1>";
}
// When we get here, debug.box refers to a <div> element into which
// we can insert our debugging message.
// First, create a <p> 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 <div> that holds the debugging output
debug.box.appendChild(p);
}
Debugging Using alert() Methods "html"
<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>
Handle error
/*
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("<div align="center">");
d.write("<font size="7" face="helvetica"><b>");
d.write("OOPS.... A JavaScript Error Has Occurred!");
d.write("</b></font><br><hr size="4" width="80%">");
d.write("<form action="mailto:" + email + "" method=post");
d.write(" enctype="text/plain">");
d.write("<font size="3">");
d.write("<i>Click the "Report Error" button to send a bug report.</i><br>");
d.write("<input type="submit" value="Report Error"> ");
d.write("<input type="button" value="Dismiss" onclick="self.close();">");
d.write("</div><div align="right">");
d.write("<br>Your name <i>(optional)</i>: ");
d.write("<input size="42" name="name" value="">");
d.write("<br>Error Message: ");
d.write("<input size="42" name="message" value="" + msg + "">");
d.write("<br>Document: <input size="42" name="url" value="" + url + "">");
d.write("<br>Line Number: <input size="42" name="line" value=""+line +"">");
d.write("<br>Browser Version: ");
d.write("<input size="42" name="version" value=""+navigator.userAgent+"">");
d.write("</div></font>");
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>