-1

我有这个小 javascript 来为一些超链接添加一些类,以给它们一个很好的效果。它适用于带有 class 的元素内的任何链接linkroll。但是,当链接嵌套在某些元素和 div 中时,它不会应用效果。我发现这querySelectorAll不是很一致。

我在想如果我重写它并使用类似 jQuery 的 each() 函数,我可能会得到更好的结果。这是它现在的样子:

var supports3DTransforms = document.body.style['webkitPerspective'] !== undefined || document.body.style['MozPerspective'] !== undefined;
function linkify() {
    if (supports3DTransforms) {
        var selector = '.linkroll a';
        var nodes = document.querySelectorAll(selector);
        for (var i = 0, len = nodes.length; i < len; i++) {
            var node = nodes[i];
            var sibling = node.nextSibling; // Do not apply to images
            if (sibling.nodeName != "img") {
                if (!node.className || !node.className.match(/roll/g)) {
                    node.className += ' roll';
                    node.innerHTML = '<span data-title="' + node.text + '">' + node.innerHTML + '</span>';
                }
            }
        };
    }
}
linkify();

我怎么可能重写document.querySelectorAll(selector);和使用类似 jQuery 的东西each()呢?

4

1 回答 1

0

试试这个:

var supports3DTransforms = $('body').css('-webkit-perspective') !== undefined || $('body').css('MozPerspective') !== undefined;

function linkify() {
    if (supports3DTransforms) {
        $('.linkroll a').each(function (i, el) {
            var $el = $(el),
                $sibling = $el.next();
            !$sibling.is('img') && !$el.hasClass('roll') && $el.addClass('roll').wrap('<span data-title="' + $el.text() + '"></span>');
        });
    }
}

linkify();

示例小提琴

于 2013-11-09T14:21:01.803 回答