我如何在 javascript 中编写这个短函数？

Question

所以我使用 jquery 编写了这段代码，这是我熟悉的语言。但是，我无法成功地将其转换为 javascript，而不是使用 jquery。任何帮助将不胜感激！

// Toggle Function
$('.toggle').click(function(){
  // Switches the Icon
  $(this).children('i').toggleClass('fa-pencil');
  // Switches the forms  
  $('.form').animate({
    height: "toggle",
    'padding-top': 'toggle',
    'padding-bottom': 'toggle',
    opacity: "toggle"
  }, "slow");
});

此代码切换了我的登录页面的图标和表单。

任何提示都会很有帮助，谢谢你所做的一切！

Answer 1

这里是对原生 JavaScript 的粗略转换。您需要提供 CSS“.show”定义并可能在那里定义一些 CSS 动画以获得您想要的任何动画。

const toggleElement = document.querySelector('.toggle');

toggleElement.addEventListener('click', function() {
    const icons = this.querySelectorAll('i');
    icons.forEach(iconElement => iconElement.classList.toggle('fa-pencil'));

    const form = document.querySelector('.form');
    form.classList.toggle('show');
}, false);

我如何在 javascript 中编写这个短函数？

How could I write this short function in javascript?

html

javascript

css

jquery

login