Html+js Snake

Game Area Limited In a UL, each of the snakes are composed of Li, each Li is used position positioning. Food is created as a Div, each time a snake head touches food, creating a new Li,li will automatically load the tail of the snake and then change the location of the food by random number. By responding to the keyboard's WASD control the direction of the snake head (with the onkeypress event and KeyCode), with the timer control the snake head automatically walk, with the array to store the snake head each time the top and left values, with the loop to assign these top and left values to the Li behind the Snake head, So the snake will move with the snake's head.

：

Callout: red circle is food, snake Head is black.

The code is as follows:

<!        DOCTYPE html>
Html+js Snake