A DOM collection (such as an HTMLNodeList) works much like an array but, unfortunately, doesn't have the standard JavaScript array methods. For that reason, if we want to slice a set of DOM elements we have to call the corresponding array method directly from its prototype object. Let's see how.

We have the following DOM structure:

<ol id="test">

Implementing a slice() utility function requires the use of the call() method provided by the Function object:

var slice = function(elements, start, end) {
    var sliced =, start, end);
    return sliced;

The first parameter is the DOM set, followed by the two offsets that will be used to slice the collection. Here's a practical example:

var elems = document.getElementById('test').getElementsByTagName('li');
var html = '<ol>';
var slices = slice(elems, 2, 6),
    len = slices.length,
    i = 0;
for(i; i < len; i++) {
    html += '<li>' + slices[i].firstChild.nodeValue + '</li>';

html += '</ol>';

var output = document.createElement('div');
output.innerHTML = html;

You can see the demo below.


Live demo