CODEFETCH™
            Examples
Cache of ProgWeb Online/Chapter Code Snippets/ch22.txt from
http://media.wiley.com/product_ancillary/06/07645882/DOWNLOAD/WebStandardsProgrammersReference(588206).zip
Source code below from:
Web Standards Programmer's Reference : HTML, CSS, JavaScript, Perl, Python, and PHP
By Steven M. Schafer
Published 05 August, 2005
Average rating

      Powells     Alibris 

NewWin = window.open("example.htm","newWindow",
  "width=400,height=400,scrollbars=no,resizable=no");

=====================================

function shudder() {
  // Move the document window up and down 5 times
  for (var i=1; i<= 5; i++) {
    window.moveBy(8,8);
    window.moveBy(-8,-8);
  }
}

=====================================

<script type="text/JavaScript">
  today = new Date;
  document.write((today.getMonth()+1) + "/" + today.getDate() + 
    "/" + today.getFullYear());
</script>

=====================================

<script type="text/JavaScript">
  today = new Date;
  newWin = window.open("","","width=400,height=400,scrollbars=no,resizable=no");
  newDoc = newWin.document.open();
  newDoc.write((today.getMonth()+1) + "/" + today.getDate() + 
    "/" + today.getFullYear());
  newDoc.close();
</script>

=====================================

...
<head>
<script type="text/JavaScript">
  function dolength() {
    document.form1.addlength.value =
      document.form1.address.value.length;
  }
</script>
</head>
<body>
<p>
<form name="form1" action="handler.cgi" method="post">
Length: <input type="text" name="addlength" size="5" /><br />
Address: <input type="text" name="address" size="30" onkeyup="dolength();"/>
</form>
</p>
...

=====================================

<head>
<script type="text/JavaScript">

function checkall(field) {
  for (i=0; i<field.length; i++) {
    field[i].checked = true;
  }
}

</script>
</head>
<body>

<p><form name="form1" action="handler.cgi" method="post">
<input type="checkbox" name="list" /> one<br />
<input type="checkbox" name="list" /> two<br />
<input type="checkbox" name="list" /> three<br />
<input type="checkbox" name="list" /> four<br />
<input type="checkbox" name="list" /> five<br />
<input type="checkbox" name="list" /> six<br />
<input type="checkbox" name="list" /> seven<br />
<input type="button" name="x" value="checkall"
  onclick="checkall(document.form1.list);" /><br />
</form>

=====================================

with (document.location) {
  var url = protocol + "//";
  url += hostname;
  if (port) { url += ":" + port; }
  url += pathname;
  if (hash) { url += hash; }
}

=====================================

document.location = "http://www.yahoo.com";

=====================================

history.back();

=====================================

<input type="button" value="Click Me" id="button" onclick="dosomething(self);" />

=====================================

function dosomething(el) {
... // do something with the element referenced by el ...
}

=====================================

function changecolorRed(el) {
  el.style.color = "red";
}

=====================================

<p onclick="changecolorRed(this);">When clicked, the text will change to red.</p>

=====================================

element = getElementById("elementID");

=====================================

element = getElementById("address");
...
<input type="text" size="30" id="address">

=====================================

addlength = element.length;

=====================================

if (document.all || document.getElementById) {
  ...getElementById should be available, use it...
}

=====================================

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Hidden Text</title>
<style type="text/css">
  ul.hidelist li { display: none; }
  ul.showlist li { display: block; }
</style>
<script type="text/JavaScript">

function hideNreveal(list) {
  if (list.className == "hidelist") {
    list.className = "showlist";
  } else {
    list.className = "hidelist";
  }
}

</script>
</head>
<body>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
mollit anim id est laborum.</p>
<p>
<ul id="list1" class="hidelist" 
    onclick="hideNreveal(this);">An unordered list.
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
mollit anim id est laborum.</p>
</body>
</html>

=====================================

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Moving Text</title>
<style type="text/css">
  p.movable { position: relative; top: 0; left: 0; }
</style>
<script type="text/JavaScript">
  function moveme(el) {
    if (el.style) { el = el.style; }
    el.top = "-5px"; el.left = "20px";
  }
</script>
</head>
<body>
<p class="movable" onclick="moveme(this);">Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
mollit anim id est laborum.</p>
</body>
</html>

=====================================