2

指定された HTML...

<ol>
    <li>The seventh</li>
    <li>8th</li>
    <li>(10-1)</li>
    <li>One</li>
    <li>2</li>
    <li>Trois</li>
</ol>
<ol>
    <li>Fourth</li>
    <li>5</li>
    <li>Number six</li>
</ol>​

そしてJavaScriptコード...

$("li").each(function() {
    alert($(this).text());
});​

element で開始し、 elementで終了するように反復順序をオフセットするにはどうすればよいですか?<li>One</li><li>(10-1)</li>

コードサンプルは jsfiddle で入手できます。

4

8 に答える 8

5

たぶんあなたの場合には何も良いことはありません:

$.each(["one", "two", "three", "four", "five", ...], function(i, v) {
    var $this = $("li." + v);
    // ...
});​

デモ: http://jsfiddle.net/ZapyJ/2/

于 2012-12-19T16:50:51.990 に答える
4

JavaScript が、多くの余分な作業なしに、英語の数字をインテリジェントに番号順に並べ替えるとは期待できません。data-番号順で属性を追加してから、単純なforループでそれらを抽出する方がはるかに優れています。

HTML:

<ol>
    <li data-num="4">Four</li>
    <li data-num="5">Five</li>
    <li data-num="1">One</li>
    <li data-num="2">Two</li>
    <li data-num="3">Three</li>
</ol>
​

JS:

var max = $('li').length;
for (var i=1; i<max; i++) {
    var txt = $('li[data-num='+i+']').text();
    alert(txt);
};​

http://jsfiddle.net/mblase75/ZapyJ/1/

于 2012-12-19T16:51:01.250 に答える
3 
var arr = ['one', 'two', 'three', 'four', 'five']
$("li").sort(function(a, b) {
    return arr.indexOf(a.className) > arr.indexOf(b.className)
}).each(function() {
    console.log(this.className)
});

http://jsfiddle.net/r55BY/

于 2012-12-19T16:52:32.213 に答える
3

sortOrder配列の追加、および.sort()：への呼び出し

var sortOrder = ['one','two','three','four','five'];

$("li").sort(function(a,b){ 
          return sortOrder.indexOf($(a).attr('class')) 
             - sortOrder.indexOf($(b).attr('class')); })
       .each(function() {
          alert($(this).attr("class"));
       });

実例： http： //jsfiddle.net/XatzB/

于 2012-12-19T16:52:53.663 に答える
2

どうぞ：

var $list = $("li");
​    
for (var i=2, l = $list.length, len = l + 2; i < len; i++) {
    alert($list.eq(i % l).attr('class'));
}​

jQuery でコレクションを並べ替える良い方法はありませんが、コレクションの長さとオフセットを使用して、任意のループを生成できます。読者が開始インデックスを動的に把握するための演習として残しておきます。これは、実行する必要があると思います。

于 2012-12-19T17:36:07.833 に答える
1

通常のJavaScriptループを使用するだけです。

var $query = $("li");

var count = $query.length;
var offset = 2;
for(var i=0; i<count; i++) {
    var domEl = $query.get((i + offset)%count);
    //alert(domEl.getAttribute("class"));
    alert($(domEl).attr("class"));
}

JsFiddleのコード。

于 2012-12-19T17:29:30.307 に答える
0

独自のメソッドを作成できます。これが私が行う方法です（そして、理解するのにかなりの時間がかかりました）

$.fn.offsetEach = function(offset, cb) {
  $(this.get().splice(offset).concat(this.get().splice(0,offset))).each(cb);
}

each()追加されたオフセットパラメータを除いて、jQueryのメソッドとまったく同じように機能します

$("li").offsetEach(integer_offset, function(index, element) {
     // iterates through all elements, but starts with an offset index
});

オフセットはゼロベースなので、この例では、最初からこのようにしますOne

$("li").offsetEach(3, function() {
     alert( $(this).text() );
});

フィドル

于 2014-01-30T22:28:31.310 に答える
0

「one」、「two」、「three」などのクラスを使用して自分を追い詰めないでください。むしろ、data-order数字を値として持つのようなソート可能な属性値を自動生成します。

<li data-order=7>Seven</li>
<li data-order=8>Eight</li>
<li data-order=1>One</li>

属性 (好きな名前を付けてください) を使用するdata-orderことで、コレクション内のこれらのアイテムを簡単に並べ替えてから、それらを自然な順序で繰り返し変更できます。

$('li[data-order]').sort(sortByData).text(changeText);

function sortByData (one, two) {
    return $(one).data("order") - $(two).data("order");
}

function changeText (index, value) {
   return index + " " + value; 
}

デモ: http://jsfiddle.net/2MYJ3/1/ </p>

于 2012-12-19T17:05:48.510 に答える