getElementByTagName(a)用于autoscroll

时间:2017-03-29 10:49:19

标签: javascript jquery html page-jump

我现在拥有的是:

var a = document.getElementsByTagName('a');

我使用它来获取带有'a'的所有元素,当我滚动它时,它会自动滚动到下一个'a'元素。

问题在于我还使用链接(使用a href=""),因此有时它会滚动到链接而不是<a name="name"></a>。他们无论如何要解决这个问题?像:

var a = document.getElementsByTagName('a name=""');

(这个不起作用)

如果需要完整代码,我会在下方添加,但可能不需要。

(function () {
    var delay = false;

    $(document).on('mousewheel DOMMouseScroll', function (event) {
        event.preventDefault();
        if (delay) return;

        delay = true;
        setTimeout(function () {
            delay = false
        }, 800);

        var wd = event.originalEvent.wheelDelta || -event.originalEvent.detail;

        var a = document.getElementsByTagName('a');
        if (wd < 0) {
            for (var i = 0; i < a.length; i++) {
                var t = a[i].getClientRects()[0].top;
                if (t >= window.innerHeight * 0.95) break;
            }
        }
        else {
            for (var i = a.length - 1; i >= 0; i--) {
                var t = a[i].getClientRects()[0].top;
                if (t < -window.innerHeight * 0.5) break;
            }
        }
        $('html,body').animate({
            scrollTop: a[i].offsetTop
        }, 800);
    });
})();

2 个答案:

答案 0 :(得分:2)

尝试使用querySelectorAll()

Shape

找到一个空的

document.querySelectorAll("a[name='examplename']");

答案 1 :(得分:2)

您可以使用QuerySelector for HTML 5支持浏览器。您可以从http://caniuse.com/#feat=queryselector检查其支持

<强> QuerySelectorAll

document.querySelectorAll("a[name='<setname>']");

对于旧版浏览器,请使用Jquery

$("a[name='<setname>']")

如果您不想设置特定名称,请将其留空。 JQuery和HTML 5 querySelector

的选择器相同
document.querySelectorAll("a[name]");

$("a[name]")