jquery - 为什么 gt() 和 lt() 只是 jQuery 选择器,而 eq() 也是一个方法?

标签 jquery

在 jQuery 中,为什么只有 eq() 既是选择器 (:) 又是方法 (.),而不是 gt()lt() 只是选择器(“对象不支持该属性或方法”)?

jQuery 语法的这种不一致/差距是否有我不明白的特殊原因?

$("#eq").click(function(){
  alert($("li").eq(0).text());
  $("li").eq(1).css("background-color", "yellow");
});
$("#eq2").click(function(){
  alert($("li:eq(0)").text());
  $("li:eq(1)").css("background-color", "yellow");
});
$("#gt").click(function(){
  $("li").gt(1).css("background-color", "yellow");
});
$("#gt2").click(function(){
  $("li:gt(1)").css("background-color", "yellow");
});
$("#lt").click(function(){
  $("li").lt(1).css("background-color", "yellow");
});
$("#lt2").click(function(){
  $("li:lt(1)").css("background-color", "yellow");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="indice">
 <li>Primo capitolo</li>
 <li>Secondo capitolo
  <ul>
   <li>Sottocapitolo</li>
  </ul>
 </li>
 <li>Terzo capitolo</li>
</ul>
<button id="eq">.eq()</button>
<button id="eq2">:eq()</button><br>
<button id="gt">.gt()</button> <!-- NO -->
<button id="gt2">:gt()</button><br>
<button id="lt">.lt()</button> <!-- NO -->
<button id="lt2">:lt()</button>

最佳答案

我认为它没有足够的用处来作为内置的。使用 .eq() 而不是 :eq 允许 jQuery 使用 querySelectorAll 来大幅提高性能。

无论如何,您都可以像这样使用.slice:

$("li").slice(0,4); // :lt(4)
$("li").slice(5); // :gt(4)

或者,您自己添加它们:

$.fn.lt = function(n) {return this.slice(0,n);};
$.fn.gt = function(n) {return this.slice(n+1);};

示例:

$.fn.lt = function(n) {return this.slice(0,n);};
$.fn.gt = function(n) {return this.slice(n+1);};
$("div").lt(2).css("color", "blue");
$("div").gt(2).css("border", "1px solid red");
$("div").eq(2).css("background-color", "yellow");
<div>0</div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

关于jquery - 为什么 gt() 和 lt() 只是 jQuery 选择器,而 eq() 也是一个方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40810197/

相关文章:

javascript - jquery从不同页面调用按钮

javascript - for循环中的多个executeSql jQuery

javascript - 如何在本地包含 jQuery?

javascript - 禁用回车提交

javascript - 即使包含 jQuery,Rails 也看不到 .tooltip 方法

javascript - preventDefault on touchstart 不阻止滚动

javascript - 带有额外填充的 jquery 选项卡动态创建/删除新选项卡

javascript - 将部分文本加粗(直到第一个 '/' )

javascript - 在 Javascript 中的字符串中使用变量

未找到 Javascript 文件