Question

I am very new to Javascript.
I am having an error:

Uncaught TypeError: Cannot read property ‘children’ of null fiddle.jshell.net:1163
(anonymous function)

How to fix the error?

Providing my fiddle below:

http://jsfiddle.net/N3GTy/29/embedded/result/

var slider = new Swipe(document.getElementById('slider'), {
    callback: function(e, pos) {

        var i = bullets.length;
        while (i--) {
            bullets[i].className = ' ';
        }
        bullets[pos].className = 'on';

    }
}),

bullets = document.getElementById('position').getElementsByTagName('em'),

// tabs
tabs = new Swipe(document.getElementById('tabs'), {
    callback: function(event, index, elem) {
        setTab(selectors[index]);
    }
}),

selectors = document.getElementById('tabSelector').children;
Uncaught TypeError: Cannot read property 'children' of null

for (var i = 0; i < selectors.length; i++) {
    var elem = selectors[i];
    elem.setAttribute('data-tab', i);
    elem.onclick = function(e) {
        e.preventDefault();
        setTab(this);
        tabs.slide(parseInt(this.getAttribute('data-tab'), 10), 300);
    }
}

Answer 1

There is no element with an id of “tabSelector”. So, document.getElementById(‘tabSelector’) returns null. I tested this with chrome’s debugger by going to:

http://fiddle.jshell.net/N3GTy/29/show/light/

and running two commands from the chrome debugger console:

document.getElementById(‘slider’);
Returns a domNode as you would expect.

document.getElementById(‘tabSelector’);
Returns null, because it does not exist.

calling null.children then results in your error.