Briggs's miniature Javascript cookbook (heavily cribbed)

(To find other cookbook procedures, feel free to surf: just be sure and credit everything you didn't write.)
Using a timer
...to automatically refresh the page
Change what is displayed.
Make something disappear.

Picking cell in table. This will do it.

<html>
<head>
</head>
<body>
<script>
  'use strict'

  document.body.addEventListener ('click', flipCell);

  function flipCell (e)
  {
    if (e.target.tagName == 'TD') //If it's a table cell... flip it from X to O or O to X
    e.target.innerHTML = (e.target.innerHTML == 'X' ? 'O' : 'X');
  } 
</script>
<p>Click any cell to change it</p>
<table border="1" width="100px"> <!--The table-->
  <tr><td>X</td><td>X</td><td>X</td></tr>
  <tr><td>X</td><td>X</td><td>X</td></tr>
  <tr><td>X</td><td>X</td><td>X</td></tr>
</table>
</body>
</html>

Test.

Making "modal" popups, that is, "windows" within the browser. They won't be blocked by a popup blocker, and are a little less annoying. Still, use them with care. I think it's better to make 'em go away when your mouse moves.

The way they work: you create a div and set its style to "display: none" until the event you're waiting for happens, at which point you set its style to something else.

This example greys out the rest of the page so you can't see it, which is generally 3vil, but could be OK if there's really nothing the user can do with this page until the script is complete. Since it's in Ullman's original, I leave it in.

<!-- snippet from the HTML file -->
<head>
 <link rel="stylesheet" href="modal.css" id="css">
</head>
<body>
 <!-- whatever you wanted on the page... -->

 <input type="button" value="Show window" id="openModal">

 <div id="modalMask">
  <div id="modalContent">
   <p>This is a "modal" popup window: that is, one that is not its own 
   browser window, but appears within the browser. Less annoying, at least sometimes.</p>
   <input type="button" id="closeModal" value="Close">
  </div>
 </div>
 <script src="modal.js"></script>
</body>

modal.js:

/* Script 9.10 - modal.js */
/* From Ullman, Modern Javascript, his example from Chapter 9 */
/* Will Briggs has made small changes for clarity and added comments */

'use strict';

// Function called to open the window:
function openModalPopupWindow() 
{
 document.getElementById('closeModal').onclick = closeModalPopupWindow; // Make "close" button work
 document.getElementById('modalMask').style.display = 'inline-block';	// Make the modal popup stuff visible
 document.getElementById('openModal').onclick = null; 			// Make "show window" button stop working 
} 

// Function called to close the window:
function closeModalPopupWindow() 
{
 document.getElementById('openModal').onclick = openModalPopupWindow;	// Make "show window" button work
 document.getElementById('modalMask').style.display = 'none'; 		// Make the modal popup stuff invisible:
 document.getElementById('closeModal').onclick = null; 			// Make "close" button stop working 
} 

// Establish functionality on window load:
window.onload = function() 
{
 document.getElementById('openModal').onclick = openModalPopupWindow;	// Make "show window" button work
};

modal.css:

/* Script 9.9 - modal.css */
/* From Ullman, Modern Javascript, his example from Chapter 9 */
/* Will Briggs has made small changes for clarity and added comments */

#modalMask /* This div will cover the entire screen: 100% width and height, starting at 0, 0. 
/* When visible, it's sort of grey (#eee), sort of transparent. But initially it's invisible
so you can see the main text. */
{
 display:none;
 position: absolute;
 left: 0px;
 top: 0px;
 width:100%;
 height:100%;
 background-color: #eee; /* grey */
 z-index: 1000;
 opacity: 0.9;
 filter:alpha(opacity=90);
 -moz-opacity: 0.9;
}

#modalContent /* This is for the content of the modal window: white bkgd, black border, centered, etc.*/
{
 position: relative;
 width:300px;
 margin: 15px auto;
 padding:15px;
 background-color: #fff;
 border:1px solid #000;
 text-align:center;
 z-index: 9999;
}

Test.

Skip if you want: a demo on how to get Javascript to call PHP, using AJAX.