Как написать плагин jQuery

Question

Я хотел бы написать плагин jQuery, который является «привязкой» к элементу DIV, и он работает с is. После пары пробных ошибок я закончил с просто копированием примера с этой страницы - http://learn.jquery.com/plugins/basic-plugin-creation/.

Итак, у меня есть элемент

<div id="bends">test</div> 

Я мое основное определение, взятое из примера страницы:

(function ($) { 
    $.fn.greenify = function() { 
     this.css("color", "green"); 
     console.log(this); 
     return this; 
    }; 
}(jQuery)); 

и я называю это, как этот

$("#bend").greenify(); 

Основываясь на пример, я ожидаю, что текст станет зеленым. К сожалению, ничего не происходит. Когда я console.log «этот» объект, он показывает:

n.fn.init {context: document, selector: "#bend"} 

Итак, я напуган, я пропускаю основную точку здесь. Что не так - почему «это» не представляет мой элемент, как в примере?

Answer 1

пожалуйста, измените строку

$("#bends").greenify(); 

Answer 2

Calling greenify должен возвращать элемент как объект JQuery. Протестировано в Google Chrome и был возвращен правильный объект.

Я был в состоянии успешно выполнять другие функции JQuery на объект, который был возвращен, как показано ниже:

var x = $("#bend").greenify(); x.css('color', 'red');

-

Кроме того, в этом вопросе, необходимо создать элемент с id bend, но вы ссылаетесь на него в Javascript как bends. Переименуйте одно из этих объявлений в соответствие с противоположным.

Answer 3

$.fn.greenify = function() { 
 
    this.css("color", "green"); 
 
    console.log(this); 
 
    return this; 
 
}; 
 

 
$('.color-me').greenify()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="color-me">Me</div>

Пожалуйста, смотрите выше, это работает, и консоль будет регистрировать объект JQuery, как это.