Access DOM element in jQuery plugin on mouseenter

Question

I'm writing a personal plugin, and it needs to do an action when it hovers over a specific element. I'm running console.log($(this)); and console.log($this); (I have var $this = $(this) before I declare my default options.

Anyways, when logging that stuff out to the console, I just get an object with the Node information, ie <li id="some_id_here"></li> , but none of the text within that <li> (there is text inside of it, as well as a <span>...</span> .

Can anybody help me here? Not sure what I need to do to grab the actual text of the <li> ...

Thank you!

Note: It was indeed the case of me assigning $this = $(this) . Once I adjusted the nomenclature, it all fell into place. Thanks for your help!

Answer 1

怎么样

console.log($(this).html())

Answer 2

If you have $this = $(this); then you can simply do:

$this.html(); // Retrieve HTML inside "<li>" referenced by $this
$this.text(); // Retrieve plain text inside "<li>" referenced by $this

So you could try:

console.log( $this.html() );

For furthermore reading, take a look to jQuery .html() and .text() methods documentation here .

Cheers!

Answer 3

First thing this inside a jQuery plugin is a jQuery object, there is no need to do the $(this) , take a look at signs of a poorly writter jQuery plugin

If you want the html of your element do this.html();

If you want the text, do this.text();

If you just do console.log(this) , you normally see a little arrow on the left side, that lets you expand the element.

Answer 4

console.log(this);

如果您记录普通的DOM元素（而不是jQuery包装器对象），则您的控制台应允许您检查该元素的子级。