是否可以將此JQuery代碼轉換為JavaScript？

Question

以下來自Google-Caja游樂場的代碼顯示了兩個框。 並且一旦您在另一個內部拖動，封閉框就會更改顏色：

<style>
  #draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
  #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
 <script>
  $(function() {
    $( "#draggable" ).draggable();
    $( "#droppable" ).droppable({
      drop: function( event, ui ) {
        $( this )
          .addClass( "ui-state-highlight" )
          .find( "p" )
            .html( "Dropped!" );
      }
    });
  });
  </script>

Answer 1

是的，這需要一些工作。 find，addClass和html都很容易，但是拖放是另一回事。 這是它的教程http://luke.breuer.com/tutorial/javascript-drag-and-drop-tutorial.aspx

Answer 2

是。 您可以將任何JavaScript庫代碼絕對轉換為純JS，因為它們畢竟是使用的。

Answer 3

有可能，但是.draggable（）和.droppable（）函數太復雜了，以至於無法在此處說明如何執行。 查看未縮小的jQuery UI。 這將為您提供一個良好的開始（盡管它仍將使用jQuery）。