javascript - jQuery 到纯 javaScript 问题

Question

我正在玩 JavaScript，并为自己设定了将昨晚编写的一些 jQuery 转换为纯 JavaScript 的任务。我遇到了几个问题，想知道是否有人感冒了可以帮我解决。

• $(this) 是一个 jQuery 对象，而不是在纯 JavaScript 中使用(this.something 是否相同)？
• 您能否在纯 JavaScript 中轻松地执行类似 .after() 的操作，还是这很愚蠢？

目前我正在将其转换为纯 JavaScript..

$('.list li').each(function(i) {
    if( ( i + 1 ) % numRow == 0 )
    {
         $(this).after( "<div class='rowBreak'></div>" );
    }
});

到目前为止我有这个:

var totalThumbs = $('.list li').length;

for ( var i = 0; i < totalThumbs; i++ ) {
    if( ( i + 1 ) % numRow == 0 )
    {
        $(this).after( "<div class='rowBreak'></div>" );
    }
}

Answer 1

jQuery 和纯 JS 中都存在一些但不是所有的函数。

after 不是其中之一。

这里有一个不用 jQuery 的例子

function insertAfter(referenceNode, newNode) {
    referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}

(来源:How to do insert After() in JavaScript without using a library?)

将你的代码转换为纯 JS 就像(注意我真的不知道你为什么要在 li 之后插入一个 div，所以我改变了它添加一个类):

var lists = document.getElementsByClassName('list');
for (var i = 0, l = lists.length; i < l; i++) {
    var items = lists[i].getElementsByTagName('li');
    for (var ii = 0, ll = items.length; ii < ll; ii++) {
        if ((ii + 1) % 2 == 0) {
            items[ii].classList.add('row-break');
        }
    }
}

http://jsfiddle.net/tB3v6/1/