[http://creativecommons.org/licenses/by/3.0/]
This work is licensed under a CC
Attribution 3.0 Unported License [http://creativecommons.org/licenses/by/3.0/]
Scripting is used on the majority of today's modern Web sites. Scripting can be used to improve the usability and accessibility of a Web site (for example for validating form data on the client side), it can vastly improve the user experience with new interface design (the smooth scrolling of Google Maps vs. older click to scroll
map services), or it can be used to implement behavior that would be impossible without scripting (for example the online applications of Google Docs). Asynchronous JavaScript and XML (Ajax) takes Dynamic HTML (DHTML) to the next level by allowing server access from within scripting code. This is accomplished by using a standardized API for client/server communications, the XMLHttpRequest object. This objects allows using HTTP connections from within scripting code, and thereby allows scripting code to dynamically reload data from a server in response to user interactions.
mouseOver events)versionsof DOM/JavaScript
missing functionality
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Well-Designed JavaScript</title> <script type="text/javascript" src="nicetitle.js"></script> <link rel="stylesheet" href="nicetitle.css" /> </head> <body> <h1>Well-Designed JavaScript</h1> <p><a href="http://en.wikipedia.org/wiki/JavaScript" title="Wikipedia: JavaScript is a scripting language used to enable programmatic access to objects within other applications. It is primarily used in the form of client-side JavaScript for the development of dynamic websites.">JavaScript</a> should not make any assumptions about browser support. Ideally, pages using scripting should also be usable when scripting is turned off, so that more basic browsers (for example, mobile phones or Kindles) can also be used for using the page.</p> </body> </html>
if( !document.links )
{
document.links = document.getElementsByTagName("a");
}
for (var ti=0;ti<document.links.length;ti++) {
var lnk = document.links[ti];
if ( lnk.title ) {
lnk.setAttribute("nicetitle",lnk.title);
lnk.removeAttribute("title");
addEvent(lnk,"mouseover",showNiceTitle);
addEvent(lnk,"mouseout",hideNiceTitle);
addEvent(lnk,"focus",showNiceTitle);
addEvent(lnk,"blur",hideNiceTitle);
}
} var d = document.createElementNS(XHTMLNS,"div");
d.className = "nicetitle";
tnt = document.createTextNode(nicetitle);
pat = document.createElementNS(XHTMLNS,"p");
pat.className = "titletext";
pat.appendChild(tnt);
d.appendChild(pat);div.nicetitle {
position: absolute;
padding: 4px;
top: 0px;
left: 0px;
color: white;
width: 25em;
background: url(nicetitle-bg.png);
/* Mozilla proprietary */
-moz-border-radius: 12px;
}
div.nicetitle p {
margin: 0; padding: 0 3px;
}
<p>The current time is <script type="text/javascript"> var currentTime = new Date() ; document.write(currentTime.getHours() + ":" + currentTime.getMinutes()) ; </script>.</p>
<p>The current time is .</p>
too slow for serious applications
desktop applications
fixing them
for (var ti=0;ti<document.links.length;ti++) {
var lnk = document.links[ti];
if ( lnk.title ) {
lnk.setAttribute("nicetitle",lnk.title);
lnk.removeAttribute("title");
addEvent(lnk,"mouseover",showNiceTitle);
addEvent(lnk,"mouseout",hideNiceTitle);
addEvent(lnk,"focus",showNiceTitle);
addEvent(lnk,"blur",hideNiceTitle);
}
}extensionsto the basic DOM model
locally
XMLHttpRequest API has been built for requesting XML via HTTPXMLHttpRequest has to be parsed into a DOM tree<?xml version="1.0"?> <menu id="file" value="File"> <popup> <menuitem value="New" onclick="CreateNewDoc()"/> <menuitem value="Open" onclick="OpenDoc()"/> <menuitem value="Close" onclick="CloseDoc()"/> </popup> </menu>
{ "menu" : {
"id" : "file",
"value" : "File",
"popup" : {
"menuitem" : [
{ "value" : "New", "onclick" : "CreateNewDoc()" },
{ "value" : "Open", "onclick" : "OpenDoc()" },
{ "value" : "Close", "onclick" : "CloseDoc()" }
]
}
}}best JavaScript framework
is there a collapse/expand folder view?)
is the framework openly licensed)