Совместное использование jQuery и стандартного JavaScript

Question

У меня есть эта строка JavaScript / jQuery, которую я пытаюсь использовать, чтобы добавить элемент в DOM и затем присоединить eventlistener к.

$('.faq_answer').prev().append(finalRender.cloneNode(true)).addEventListener("click", function () {toggle(this)}, false); 

Я знаю, что добавляющая часть работает отлично, но добавление прослушивателя событий вызывает у меня горе.

Возможно / желательно ли использовать jQuery и обычный JavaScript вместе, как это? Или есть что-то в JQuery, что будет работать лучше (Очень плохо знаком с jQuery, так что терпите меня).

Answer 1

Если вы хотите использовать нативные методы, вам нужно вызывать их для элементов DOM, а не для объектов jQuery

var clone = finalRender.cloneNode(true);
clone.addEventListener("click", function () {toggle(this)}, false);

$('.faq_answer')
      .prev()
      .append( clone );

Если вы хотите использовать jQuery, вам нужно обернуть элементы DOM вобъект jQuery.

  // Drop your DOM element----v----into a jQuery object
var clone = $( finalRender.cloneNode(true) ).bind("click", function (){
    toggle(this);
});

$('.faq_answer')
      .prev()
      .append( clone );

Answer 2

Я нахожу такие вопросы странными, потому что jQuery - это JavaScript.

На основании этого смешивания кода, который представляет собой простой JavaScript с кодом jQuery, все в порядке.

Но если в jQuery есть более простой способ делать то, что вы хотите, то я бы сказал, что нужно использовать только jQuery.

Answer 3

Да, их можно использовать «вместе», потому что jQuery - это JavaScript.Однако в этом случае нет никакой причины связывать обработчики событий напрямую, если вы используете библиотеку.Он уже знает, как управлять обработчиками событий, и делать это вне его контроля, вероятно, не очень хорошая идея, если вы действительно не знаете, что делаете.

Answer 4

Я думаю, что вы хотите добавить слушателя событий в клонированный узел, а не в prev() из .faq_answer.

Если вы импортируете jQuery, почему бы в любом случае не использовать метод .click() вместо микширования? Это проще! :)

$('.faq_answer').prev().append(finalRender.cloneNode(true).click(function(){
    toggle(this)
}));

Answer 5

Вы можете сделать что-то вроде этого:

 $('.faq_answer').prev().append(finalRender.cloneNode(true)).click(function () {toggle(this)});

, что является чистым jquery