earth tech

[software and hardware technology originating from or otherwise pertinent to planet earth]

use these buttons to share this blog on portal sites:

Monday, April 6, 2009

Studying the HTML DOM

http://www.w3schools.com/htmldom/dom_reference.asp

The World Wide Web Consortium (W3C) defines the HTML Document Object Module (DOM) as a standard. The DOM is used as a standardized way to programmatically access the content of HTML [and XML – we're only concerned with the HTML, here] documents.

Languages commonly used to access and modify the content of a DOM document instance [an instance of a DOM-conformant document] are Java and Javascript.

In this case, we are interested in accessing and modifying the content (data and meta-data) of an HTML document using Javascript to manipulate HTML elements using DOM-defined methods.

Reference Material

Document Object Model (Core) Level 1 – REC-DOM-Level-1-19981001 from W3C
HTML DOM Tutorial &ndash from w3schools.com
HTML DOM Reference – provided by w3schools.com

Labels: html, javascript, w3c, web, webappdev, xml

posted by pd wilson # 17:43

Thursday, March 12, 2009

Markup and Typography

http://www.alistapart.com/stories/emen/

The blog "A List Apart" has a cool article on using dashes and hyphens in HTML — those nasty –, —, and  characters, y’kno?

From the article:

‘ for an opening single quote (Ctrl + ` ` in Word—that’s two grave accents—that character on the tilde key).

’ for a closing single quote (or an apostrophe) (Ctrl + '' in Word).

“ for an opening double quote (Ctrl + ` " in Word).

” for a closing double quote (Ctrl + ' " in Word).

… and …

I’ll bet you didn’t know this about HTML—the <q> and <blockquote> elements are designed to have quote marks automatically inserted in the appropriate locations. No current browser does this by default, however, and even those that do when faced with the appropriate style sheet markup (as detailed in CSS) get it wrong, especially with curly quotes.

See the article for the full story.

Labels: html, typography, web

posted by pd wilson # 17:49

Tuesday, May 20, 2008

Google API Example Code [Obtained Key]

http://code.google.com/apis/gdata/client-js.html#Obtain_Key

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>My Google Data API Application</title>
    <script src="http://www.google.com/jsapi?key=ABQIAAAAEF0hbwoIdolnKjr5eMdCPRR65_V0rae5Sii3SwQWquZGohjOQRRV-du2YimkeA46q7aGVN6U-luT3w" type="text/javascript"></script>
    <script type="text/javascript">
    //<![CDATA[

    google.load("gdata", "1");

    function OnLoad() {
      // Fill out
    }

    //]]>
    </script>
  </head>
  <body onload="OnLoad()">
    <div id="panel"/>
  </body>
</html>

Labels: code, gdata, gooogle, javascript, web

posted by pd wilson # 21:32

Thursday, January 25, 2007

CSS syntax highlighter

Checking out the JavaScript drawing program example called Doodle at the webreference.com section on JavaScript Programming, I found this bit of CSS that does syntax highlighting: SyntaxHighlighter.css [http://www.webreference.com/css/SyntaxHighlighter.css]

See also the Doodle Javascript programming example provided by WebReference for use of these style classes. Nice bit of work.

Here is a trivial example of the HTML to use of some of SyntaxHighlighter.css classes [from the example article, page 3]:

<div style="width: 700px;">
<textarea name="code" class="javascript" cols="60" rows="10"> 

<P class=code>&lt;script src="core.js" 
type=text/javascript&gt;&lt;/script&gt;<BR>&lt;script src="graphics.js" 
type=text/javascript&gt;&lt;/script&gt;<BR>&lt;script src="canvas.js" 
type=text/javascript&gt;&lt;/script&gt;<BR>&lt;script 
type=text/javascript&gt;<BR>var canvas = null;<BR>function initCanvas() 
{<BR>&nbsp;&nbsp;&nbsp;canvas = new 
Canvas($('theCanvas'));<BR>}<BR>window.setTimeout(initCanvas, 
10);<BR>&lt;/script&gt;<BR>&nbsp;&nbsp;&nbsp;&lt;div id="theFrame" 
class="CanvasFrame"&gt;&lt;/div&gt;<BR>&nbsp;&nbsp;&nbsp;&lt;div id="theCanvas" 
class="Canvas"&gt;&lt;/div&gt;<BR>&lt;/div&gt;</P>

</textarea>
</div>