JSFiddle

  • DOM Enlightenment Book #14 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    <!-- Don't block, just start downloading and then parse the file when it's done downloading -->
    <script async src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js"></script>
    
    <!-- Don't block, just start downloading and then parse the file when it's done downloading -->
    <script async src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    
    <!-- Don't block, just start downloading and then parse the file when it's done downloading -->
    <script async src="http://cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.0.6/jquery.mousewheel.min.js"></script>
    
    
    <script>
    // we have no idea if jQuery has been loaded yet likley not yet...
    console.log(window['jQuery'] === undefined);//logs true ...</script></!--></!--></!-->
  • DOM Enlightenment Book #18 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    console.log(document.elementFromPoint(50,50));
    
  • DOM Enlightenment Book #10 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    //If you keep focus on the window/tab that has the document loaded its true. If not it's false ...
  • DOM Enlightenment Book #30 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    //dom()
    console.log(dom());
    console.log(dom(''));
    console.log(dom('body'));
    console.log(dom('<p>Hellow</p><p> World!</p>'));
    console.log(dom(document ...
  • DOM Enlightenment Book

    No-Library (pure JS), HTML, CSS, JavaScript

    //logs null
    console.log(document.doctype.nodeValue);
    console.log(document.nodeValue);
    console.log(document.createDocumentFragment().nodeValue);
    console.log(document.querySelector ...
  • DOM Enlightenment Book #25 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    //logs null
    console.log(document.doctype.nodeValue);
    console.log(document.nodeValue);
    console.log(document.createDocumentFragment().nodeValue);
    console.log(document.querySelector ...
  • DOM Enlightenment Book

    No-Library (pure JS), HTML, CSS, JavaScript

    (function() {
    
        //Store a reference to the head object, window in the browser or global on the server
        var rootObject = this ...
  • DOM Enlightenment Book #20 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    <!-- inline attribute event handler pattern -->
    <body onclick="console.log('fire/trigger attribure event handler')">
    
    <div>click me</div>
    
    <script>
    var elementDiv = document.querySelector('div');
    
    // property event handler pattern
    elementDiv.onclick = function(){console.log('fire/trigger property event ...</script></body></!-->
  • DOM Enlightenment Book

    No-Library (pure JS), HTML, CSS, JavaScript

    <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.0.6/jquery.mousewheel.min.js"></script>
    
    <script>
    console.log(document.scripts[0].src,document.scripts[1].src,document.scripts[2].src);
    </script>
  • DOM Enlightenment Book #36 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    document.querySelector('table').addEventListener('click', function(event) {
        if (event.target.tagName.toLowerCase() === 'td') { //make sure we only run code if ...