javascript - Append(), One() 的 jQuery 到 JavaScript 翻译

Question

与这些 jQuery 函数等效的 JavaScript 是什么。这就是我所拥有的，但由于某种原因，我找不到与最后一个函数等效的函数。

My Code  
    game[0].appendChild(thisBox);

    setTimeout(function () {
        thisBox.classList.add("move");
    }, random(0, 3000));

    // thisBox.one("webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend",
    //     function (event) {
    //         $(this).remove();
    //     });

Code I am trying to translate
//insert gift element
  $(".game").append(thisBox);

  //random start for animation
  setTimeout(function(){
    thisBox.addClass("move");
  }, random(0, 5000) );

  thisBox.one("webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend",
     function(event) {
    $(this).remove();
  });

标签： javascriptjquerycss

Answer 1

对 vanilla JS 的翻译是为每种事件类型添加一个事件侦听器，{ once: true }以便每个事件回调最多只运行一次：

'webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend'
  .split(' ')
  .forEach((eventName) => {
    thisBox.addEventListener(eventName, () => thisBox.remove(), { once: true });
  });