Question

我想在纯 JavaScript 中重写 jQuery ：

var gallery1 = $('.gallery a');

gallery1.click(function(event){
    event.preventDefault();
    console.log('onclick');
});

在试图弄明白后，我结束了这样的事情：

var gallery = document.querySelector('.gallery a');

gallery.onclick = function(event){
    event.preventDefault();
    console.log('onclick');
};

但它仅适用于ul的第一个锚。

当我尝试使用querySelectorAll('.gallery a')时，它什么也没做。

我是 JavaScript 的新手。有人能帮我解决一下吗？

HTML

<ul class="gallery" id="gallery">
    <li class="">
        <a href="img/gallery/gallery1.jpg" class="" id="anchor">
            <img src="img/gallery/gallery1.jpg" alt="image 1" class="img">
        </a>
    </li>
    <li class="">
        <a href="img/gallery/gallery2.jpg" class="">
            <img src="img/gallery/gallery2.jpg" alt="image 1" class="img">
        </a>
    </li>
    <li class="">
        <a href="img/gallery/gallery3.jpg" class="">
            <img src="img/gallery/gallery3.jpg" alt="image 1" class="img">
        </a>
    </li>
    <li class="">
        <a href="img/gallery/gallery4.jpg" class="">
            <img src="img/gallery/gallery4.jpg" alt="image 1" class="img">
        </a>
    </li>
    <li class="">
        <a href="img/gallery/gallery5.jpg" class="">
            <img src="img/gallery/gallery5.jpg" alt="image 1" class="img">
        </a>
    </li>
</ul>

Answer 1

您需要处理<link rel="stylesheet" media="mediatype and|not|only (media feature)" href="mystylesheet.css"> <link rel="stylesheet" media="screen and (max-height:700px)" href="style-max-700-height.css">：

中类似于数组的节点列表

querySelectorAll()

使用javascript queryselectorall而不是jquery选择器

1 个答案: