document.body.insertBefore(
    document.createElement("test1"), document.body.childNodes[0]
);

That could've been easier. I think. Bottom line is that you're taking the parent node, and inserting a new node (first parameter) before the existing (second param). Here, of course, I'm doing it to the body. Sub document.body with the node o' your choice.

EDIT: So here's a slightly nicer way of inserting html, since the above won't actually parse HTML in the string...

function insertAsFirstChild(strHtml, nodeWithChildren)    {
    // If strHtml isn't wrapped in tags, we probably want to put into
    // a span so that we can accept html. CreateTextElement would push
    // out the text as is, showing markup in the page.
    var newSpan, strTag, strEndTag;

    newSpan = document.createElement("span");
    if (!nodeWithChildren)  {
        nodeWithChildren = document.body;
    }

    if (
        0 === strHtml.indexOf("<")
        && strHtml.length - 1 === strHtml.lastIndexOf(">")
        && strHtml.indexOf("</" > -1)
    ) {
        strTag = strHtml.substring(1, strHtml.indexOf(">"));
        strEndTag = strHtml.slice(strHtml.lastIndexOf("</")+2, -1);

        if (strTag && strTag === strEndTag)   {
            newSpan = document.createElement(strTag);
            strHtml = strHtml.substring(strHtml.indexOf(">")+1, strHtml.lastIndexOf("</"));
        }
    }

    newSpan.innerHTML = strHtml;
    nodeWithChildren.insertBefore(newSpan, nodeWithChildren.childNodes[0]);
}

Labels: ,