console.log($("ul li")); console.log($("ul")); console.log($("li"));区别

这三个语句都是使用jQuery选择器选中DOM元素，但选中的范围和结果不同。

第一个语句 `console.log($("ul li"));` 选中的是ul元素下的所有li元素，即选择器针对的是某个父元素的子元素，返回的是一个包含多个li元素的jQuery对象。

第二个语句 `console.log($("ul"));` 选中的是所有ul元素，返回的是一个包含多个ul元素的jQuery对象。

第三个语句 `console.log($("li"));` 选中的是所有li元素，返回的是一个包含多个li元素的jQuery对象。

相关问题

tbody.onclick = function (e) { var e = e || document.event console.log(123) console.log(e.target) if (e.target.nodeName == 'SPAN') { this.parentElement.remove() } 这行代码如何删除li }

这段代码可以删除 `li` 元素的父元素, 也就是 `ul` 元素, 通过 `e.target` 获取到点击的元素, 如果该元素的 `nodeName` 是 `SPAN`, 则将其父元素删除。以下是修改后的代码:

tbody.onclick = function (e) {
    var e = e || document.event;
    console.log(123);
    console.log(e.target);
    if (e.target.nodeName == 'SPAN') {
        e.target.parentNode.parentNode.remove(); // 删除 li 元素的父元素 ul
    }
}

这里需要调用两次 `parentNode` 才能获取到 `li` 元素的父元素 `ul`，因为 `e.target` 是点击的 `span` 元素，而 `li` 元素是 `span` 元素的父元素的父元素。

<script> window.onload = function(){ var ul = document.querySelector("ul"); var lis = document.querySelectorAll("li"); for(var i=0; i<lis.length; i++){ lis[i].index = i; lis[i].onclick = function(event){ event = event || window.event; console.log(event.target.innerText, event.target.index); } } ul.addEventListener("click",function(e){ e = e || window.event; console.log(e.target.innerText, e.target.index); },false); for(var i=0; i<lis.length; i++){ lis[i].index = i; } var btn = document.querySelector("#btn"); var txt = document.querySelector("#txt"); btn.onclick = function(){ var li = document.createElement("li"); li.innerText = txt.value; ul.appendChild(li); } } </script>

这是一段 JavaScript 代码，主要实现了以下功能：

1. 获取 ul 元素和所有的 li 元素，并为每个 li 元素添加一个 index 属性。
2. 给每个 li 元素添加一个点击事件，当点击时，会在控制台输出该 li 元素的文本内容和 index 值。
3. 给 ul 元素添加一个点击事件，当点击 li 元素时，会在控制台输出该 li 元素的文本内容和 index 值。
4. 给添加按钮 btn 添加一个点击事件，当点击时，会创建一个新的 li 元素，并将其添加到 ul 元素中。

值得注意的是，代码中使用了事件委托，即将事件绑定到父元素上，通过 event.target 来获取触发事件的子元素。这样可以减少事件绑定的数量，提高页面性能。