What Works for Me

I’ve written a Javascript library called html.js. One feature provided by this library allows you to easily generate HTML code. So instead of writing this…

var myHtml =
  ‘
’+moreSpaghetti+’

’;

… ad nauseum, you can now write this:

var myHtml =
  $div(
    {”class”: myClassName},
    $span(
      {},
      $p(
        {},
        “hi!”)
      +
      $p(
        {},
        “sup?”)));

… which produces this HTML:

  

hi!

sup?

  

Note, though, that the $img() function takes as arguments the img’s attributes, and src value, rather than textual content.

So, use $img like this: $img({}, "google.png") to get this:

But there are other features as well:

• document.insertElement(eltOrTagName)
  This function allows you to insert a new element into the document. Pass in an element or a tag name (e.g. “div”). The function returns the element object.
• document.getElementsIntersectedBy(classOfElts, elt)
  This function allows you to get all the elements that geographically intersect with elt. Pass in the CSS class name of the elements to look at.
• Element.doesIntersect(left, right)
  This function tells you whether two elements geographically intersect with each other.
• Element.getElementAbsolutePosition(elt)
  Returns an object/hash that indicates the absolute position of an element (relative to the page, rather than just the parent element). So if you have a deeply-nested div, you can use this function to get its overall location.
• Get mouse position with mouse_x and mouse_y
  Any time you want to get the x and y position of the mouse, simply refer to the global variables mouse_x and mouse_y! These variables are constantly updated (with a negligible amount of CPU time used), so there’s no extra work for you to do.

Enjoy!

Please leave comments on this story if you have suggestions or bugfixes. Thanks!