2017-06-05 4 views
2

私はjQueryを学んでおり、:eq()セレクタを使用しているときにこの「不定」エラーが発生します。:eq()セレクタが未定義を返します

<!DOCTYPE html> 
<html> 
<head> 
    <title>:eq() selector example</title> 
</head> 
<body> 
    <div> 
     <button>Button #1</button> 
     <button>Button #2</button> 
     <button>Button #3</button> 
     <button>Button #4</button> 
     <button>Button #5</button> 
     <button>Button #6</button> 
    </div> 

    <script src="jquery-2.1.4.min.js"></script> 
    <script src="script.js"></script> 
</body> 
</html> 

、スクリプト:ここではHTMLで

var myButton = $('button:eq(5)'); 
console.log(myButton.textContent); 

私はvar myButton = $('button')[5];すべてはいえ結構です使用

+0

あなたは 'テキストを使用する必要があります()' –

+3

'があります。eq()'と '.EQ()'の両方が、一方、jQueryオブジェクトを生成する '[]' DOMノードを生成します。あなたの例では、 'button:eq(5)'はundefinedを返さず、 'textContent'を持たないものを返します。 –

答えて

2

$('button:eq(5)')リターンjQueryオブジェクトのようにしてみてくださいを使用あなたはそれにプロパティtextContentにアクセスできる理由という

var myButton = $('button:eq(5)'); 
console.log(myButton.text()); 

$('button')[5];リターンDOMオブジェクト:代わりに、要素のテキストを取得するための10

var myButton = $('button')[5]; 
console.log(myButton.textContent); 

・ホープ、このことができます。

+0

ありがとうございます。私はまだjQueryのメソッドには手をつけていません:) '$( 'button')[5];'良い方法ですか? –

+0

DOMオブジェクトを取得したい場合は、jqueryを使用しない方がよいです。代わりに 'document.querySelectorAll( 'button')[5]'を使う方が良いです... –

0

jqueryオブジェクトで行うtext() .selector $('button:eq(5)'); jqueryオブジェクトを返します。textContentはDomオブジェクトです。容認できないものです。

var myButton = $('button:eq(5)'); 
 
console.log(myButton.text());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <button>Button #1</button> 
 
    <button>Button #2</button> 
 
    <button>Button #3</button> 
 
    <button>Button #4</button> 
 
    <button>Button #5</button> 
 
    <button>Button #6</button> 
 
</div>

OR

あなたは両方の組み合わせを必要とする場合は、あなたがしなければならないので、textContent性質を持っていないこの

$('button:eq(5)')[0].textContent 
0

$('button')[5]これはtextContentという性質を持つDOM要素の参照を返します。

$('button:eq(5)')は、このプロパティを持たないjQueryオブジェクトです。未定義が返されます。

.text()関数にjQueryオブジェクトを使用します。

var text = $('button:eq(5)').text() 
関連する問題