2017-02-20 4 views
1

私は最近、jQueryのチュートリアルを通過してきたし、男は、私は本当に理解していなかった何かの上にbreezed ...スクリプトとマークアップは次のとおりです。jQuery Beginner - このif文の論理を説明しますか?

$("document").ready(function() { 
 
     $("#example p").replaceWith(replacementFn); 
 
    }); 
 

 
    function replacementFn() { 
 
     if ($(this).text().indexOf("1") != -1) { 
 
      return "<p>This is paragraph uno</p>"; 
 
     } 
 
     else { 
 
      return this.outerHTML; 
 
     } 
 
    }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="example"> 
 
    <p class="a">This is paragraph 1</p> 
 
    <p id="para1">This is paragraph 2</p> 
 
    <p class="b">This is paragraph 3</p> 
 
    <p id="para4" lang="en-us">This is paragraph 4</p> 
 
    <p id="para5" lang="en-gb">This is paragraph 5</p> 
 
</div>

Iの事indexOf( "1")!= -1 '。私はそれを理解しています!= =' not equal to 'を意味し、私たちが探していることです。それぞれのp要素に「1」という数字が書かれていますが、-1が何を意味しているのか、それがなぜ真実であるのか理解できません。

チュートリアルの男は、単に「文字列「1」を探してみましょう。それは1と同じではなく、それが見つかったことを意味します。

これはプログラマにとっては非常に明白ですが、私はjQueryとJavascriptの基礎を学ぶフロントエンドの開発者です。相対的な一般人に理にかなった説明があれば幸いです! $(this).text().indexOf("1")

+4

'.indexOf()'関数は '返し-1'それが文字列で検索対象が見つからないとき。 – Pointy

+1

'.indexOf()'から返される非負の数値は、見つかったインデックスです。 '-1'は常にインデックスの範囲外であるため、' -1'はインデックスが見つからなかったことを意味します。 (技術的にすべての負の数は常にインデックスの範囲外ですが、慣例では '-1'が使用されます) – David

+1

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf – j08691

答えて

4

-

  1. $(this).text()
  2. jQueryの
  3. からjQueryの機能は、コア機能は、内 1の位置を発見するJavaScriptテキスト(HTMLではない)の選択から(点1)
  4. .indexOf("1")を選択するセレクタであり選択したテキスト(ポイント2)[1は第1段落にあります](indexOf("Find_What")が尋ねたものが見つからない場合は-1を返します。

列における一致の基本的indexOf戻りインデックスとIndexOfメソッド( "1")として0が返される例 -

"1st paragraph".indexOf("1");

ためには0、1 ...

であってもよいですそれは最初の位置です。この場合

"<p>paragraph 1</p>".indexOf("1") それは13

を返しますので、-1は、文字列内の「1」(マッチ)の不在のために必ずケースです。

PS-また、indexOfは、JavaScriptで文字列内の何かを検索するために、より高速で優先する機能です。

Hereあなたは「indexOf」の詳細についてあなたの渇きを解消することができます。引数として与えられた文字列が、そうでない場合は、検索文字列内の検索文字列の位置を検索し、文字列に含まれていない場合

+1

ありがとうございました(と他の回答)私のためにそれをクリアします。私はjqueryセレクタなどを理解していました。私が見逃していたのは、indexOf()が-1を返し、見つからなければ、 '1のインデックスが'見つからない 'という意味になります。誰もがうれしい。 – Barry

+0

@ Barry indexOfは、開発者の間で好まれている方法です。 :) –

1
if ($(this).text().indexOf("1") != -1) 

のJavaScriptのindexOf()戻り-1

JavaScriptはほとんどの言語と同様に、0から始まるインデックスを使用するため、戻り値0は、検索された文字列の先頭に「1」があることを意味します。

1

indexOf()関数は、最初に検索される部分文字列が存在する文字列の位置を返し、部分文字列が存在しない場合は-1を返します。

この例では、text().indexOf("1")は1が最初に表示される位置を返します。 1が存在しない場合、indexOf()は-1を返します。

0

$(this).text()(と呼ばれる要素テキスト)が「1」.indexOf("1")が含まれている場合、機能replacementFnがチェックし、それがない場合、それが返されます"<p>This is paragraph uno</p>"

indexOf()値が、これはそのように私たちが望む一致が見つからなかったこと-1等しいですそれは等しくないようにする-1別名!= -1

戻り値の文字列は、jQueryの.replaceWith()で、一致する要素のテキストを置き換えるために使用されます。

0

indexOfは、 "1"が存在する場所を返します。 0、h1、i2、s3、4、i5、s6、7、p8、a9、 'r10'、 'a11'、 'g12'、 'r13'、 'a14'、 'p15'、 'h16'、 '17'、 '118' のようになります。これらの文字列に含まれています

+0

'return 18'はどういう意味ですか?あなたは答えが私たちが期待しているものと一致しません。誰かがあなたに '-1'を返すかもしれません。 :D –

0

このスニペット全体を理解していこうと思います。

$(document).ready()コールがあることがわかります。これはページ全体がロードされているかどうかをチェックし、そうであれば引数として渡された関数を実行します。

この機能は、#example pセレクタで記述できるDOMノード(これはHTML要素として理解できますが、もう少し複雑です)を検索することから成ります。つまり、$('#example p')呼び出しはすべてidがexampleの要素に含まれている要素は<p>です。

後で、連鎖したメソッド呼び出し - .replaceWith()があります。このメソッド呼び出しはパラメータとして機能します。この連鎖メソッド呼び出しは、呼び出された要素の内容を引数として渡された要素に置き換えます。この場合、パラメータ関数が返すのはこの関数です。

replacementFn機能は、それがそれにパラメータとして渡された文字列のために呼ばれていた文字列を検索し、シーケンス場合-1を返す.indexOf()方法、で$(this)として渡された前述のDOMノードの内容(.text())を検索しますが見つからないか、または-1より大きい整数ですが、シーケンスが見つかった場合は呼び出された文字列の長さを超えません。この場合、返される数値は文字列のインデックスです。シーケンスが開始されます。それはそれが渡されたDOMノードのテキストコンテンツを検索し、それが文字1を(.indexOf()によって返された値が-1以上であるエルゴ)が含まれている場合、それは<p>This is paragraph uno</p>にノードの内容を変更する - 。戻るreplacementFn

ノードが1文字(すなわち.indexOf()方法は-1を返される)が含まれていない場合は.replaceWith()メソッドは何もしないように、それは、現在のコンテンツを返すことであるとして、それはノードを残します。

私はあなたが今それを得ることを望みます - 何かがあなたには分からない場合は、私はコメントを介して教えてください。

関連リンク:

http://api.jquery.com/replacewith/

http://api.jquery.com/text/

https://developer.mozilla.org/pl/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf/

関連する問題