Practical people. Practical problems. Practical advice.

Posts tagged document

Firefox Document methods

Sep01
2011 Written by ecomware

There are some interesting methods in this list. (Run in Firefox 6.0.1)

for (i in document) {
    if (typeof document[i] == "function"  ) {
        console.log(i);
    }
}

addBinding
addEventListener
adoptNode
appendChild
captureEvents
clear
cloneNode
close
compareDocumentPosition
createAttribute
createAttributeNS
createCDATASection
createComment
createDocumentFragment
createElement
createElementNS
createEntityReference
createEvent
createExpression
createNodeIterator
createNSResolver
createProcessingInstruction
createRange
createTextNode
createTreeWalker
dispatchEvent
elementFromPoint
enableStyleSheetsForSet
evaluate
execCommand
execCommandShowHelp
getAnonymousElementByAttribute
getAnonymousNodes
getBindingParent
getElementById
getElementsByClassName
getElementsByName
getElementsByTagName
getElementsByTagNameNS
getFeature
getSelection
getUserData
hasAttributes
hasChildNodes
hasFocus
importNode
insertBefore
isDefaultNamespace
isEqualNode
isSameNode
isSupported
loadBindingDocument
lookupNamespaceURI
lookupPrefix
mozSetImageElement
normalize
normalizeDocument
open
queryCommandEnabled
queryCommandIndeterm
queryCommandState
queryCommandSupported
queryCommandText
queryCommandValue
querySelector
querySelectorAll
releaseCapture
releaseEvents
removeBinding
removeChild
removeEventListener
replaceChild
routeEvent
setUserData
write
writeln

Posted in Code, JavaScript Examples - Tagged , ,

Semantic HTML and JavaScript

Sep09
2010 Leave a Comment Written by ecomware

I love this technique. Browsers offer better support for pure XML documents and CSS than people apparently remember, because it seems developers have quit using literal XML, and use HTML (formerly XHTML) exclusively. We’re still not bound to the default block elements though. We can write very expressive markup still, and by including the JS declarations for those elements, retain decent cross-browser support.

<!doctype html>
<html>
    <head>
        <title>404 - Page not found</title>
        <script>
            document.createElement('content');
            document.createElement('text');
        </script>
    </head>
    <body>
        <style>
            content {
                display: block;
                width: 300px;
                height: 100px;
                margin: 0px;
                margin-top: 20px;
                margin-left: auto;
                margin-right: auto;

                text-align: center;

                font-family: "Century Gothic";
                font-weight: normal;
                font-size: 12px;
                color: #454545;
            }

            text {
                display: block;
                margin: 0px;
                padding: 0px;
                line-height: auto;
                text-align: center;

                font-family: inherit;
                font-weight: inherit;
                font-size: inherit;
                color: inherit;
            }
        </style>

        <content>
            <text>404. The page requested cannot be found.</text>
        </content>
    </body>
</html>
Here is an iframe with the markup from above.

Posted in Architecture, Code, CSS Examples, JavaScript Examples - Tagged , , , , , ,