Что эквивалентно функции jQuery .before() в Javascript?

node.insertBefore() в значительной степени эквивалентен: https://developer.mozilla.org/en-US/docs/Web/API/Node.insertBefore

$('#id').before('something');
//equivalent 
var node = document.getElementById('id');
node.parentNode.insertBefore('something', node);

Вот что делает jQuery: a13de27760ba1af883c0#file-gistfile1-js-L6064

before: function() {
    return this.domManip( arguments, function( elem ) {
        if ( this.parentNode ) {
            this.parentNode.insertBefore( elem, this );
        }
    });
}

вы можете использовать insertBefore в javascript

node.insertBefore(newnode, existingchild);

В приведенном выше примере новый узел будет добавлен как дочерний узел узла непосредственно перед существующим дочерним узлом.

Хорошо, эти ответы были немного обманчивы. Использование метода node.insertBefore немного отличается от использования метода jQuery .before().

// jQuery
$('.element').before('<span class="class-name">Some text</span>');

// Pure JS
var _$element = document.querySelector('.element');
var _$new = document.createElement('span');
_$new.outerHTML = '<span class="class-name">Some text</span>';
_$element.parentNode.insertBefore(_$new, _$element);

Если вам интересно, почему это выглядит так просто в фрагменте jQuery

before: function() {
    return this.domManip( arguments, function( elem ) {
        if ( this.parentNode ) {
            this.parentNode.insertBefore( elem, this );
        }
    });
}

Обратите внимание, что оно начинается с this.domManip. Эта функция делает что-то за кулисами, что позволяет абстрагироваться от создания элементов.