quiero saber la diferencia de dragover y dragenter eventos de HTML5 arrastrar y soltar.

No tengo clara la diferencia.

El evento dragenter ocurre en el momento en que arrastra algo al elemento de destino y luego se detiene. El evento de arrastre ocurre durante el tiempo que arrastra algo hasta que lo suelta.

Mira aquí:

$('.dropzone').on("dragover", function (event) {
    console.log('dragover');
});
$('.dropzone').on("dragenter", function (event) {
    console.log('dragenter');
});

Ahora mira la consola:

Como puede ver, el dragenter ocurre una vez (cuando arrastra el elemento al objetivo).

Pero el evento dragover ocurre cada pocos cientos de milisegundos.

La misma diferencia existe entre arrastrar y arrastrar iniciar, arrastrar iniciar sucede una vez pero arrastrar ocurre cada pocos cientos de milisegundos.

Basado en el dragenter y dragover Documento de MDN…

arrastre

El evento de arrastre se activa cuando se arrastra un elemento o una selección de texto sobre un destino de colocación válido (cada pocos cientos de milisegundos).

dragenter

El evento dragenter se activa cuando un elemento arrastrado o una selección de texto ingresa en un destino de colocación válido.

El dragover se activa después de un pequeño retraso (cada 350 ms, creo) mientras el cursor permanece sobre el elemento.

dragenter:

dragenter El evento se dispara solo cuando, mientras se arrastra un elemento arrastrable, el cursor entra el área de un elemento DOM que tiene el ondragenter evento adjunto.

arrastre:

Por otro lado, dragover El evento se dispara “constantemente” mientras se arrastra un elemento arrastrable, y el cursor está en la pantalla dentro del área de un elemento DOM, donde este elemento DOM tiene el ondragover evento adjunto.

La diferencia es que (mientras se arrastra) cuando el cursor entra en una zona de colocación, dragover se dispara constantemente (al mover el mouse) mientras
dragenter solo se dispara una vez, cuando el cursor ha “entrado”

MANIFESTACIÓN:

function dragover(e) {
 console.log("drag over")
}

function dragenter(e) {
  console.log("drag enter!!!")
}

#target{
  width: 200px;
  height: 200px;
  background: lightyellow;
  border: 1px solid gold;
}

div[draggable]{
  width: 60px;
  height: 60px;
  background: red;
}

<div draggable="true">Drag Me</div>
<div id="target" ondragover="dragover(event)" ondragenter="dragenter(event)">Drop Zone</div>