Recently saw the web of a JavaScript code, download down to study carefully, not before how to contact, read it over or have a lot of harvest. Sorted as follows.
Greedy Snake Code
http://blog.csdn.net/lee18254290736/article/details/51516081
Code resolution
1.h5 <canvas> Labels define graphics. Recommend a JavaScript URL: http://jo2.org/html5-canvas-tutorial-list/
The 2.getElementById () method returns a reference to the first object that has the specified ID. These methods can be found in W3cschool.
The 3.getContext () method returns an environment for drawing on the canvas.
4.canvas.getcontext (' 2d ')
The parameter ContextID specifies the type you want to draw on the canvas.
The current unique legal value is "2d", which specifies a two-dimensional drawing and causes the method to return an environment object that exports a two-dimensional drawing API.
5.context.fillrect (X,y,width,height);
Parameter values
Parameter description
x coordinates of the upper-left corner of the x rectangle
Y-coordinate of the upper-left corner of the y rectangle
Width of a rectangle, measured in pixels
Height rectangle, measured in pixels
Pixel can be said to be length
6.ctx.fillstyle= ' #FF0 ' Fill color
7.ctx.clearrect (20,20,100,50); empty an area in a rectangle to form a rectangle.
8.Javascript is very sensitive to capitalization.
9. Three-Bell method for declaring functions:
function Add (a,b) {
return a+b;
}
var add=function Add (a,b) {
return a+b;
}
JavaScript is sensitive to case sensitivity. The keyword function must be lowercase and must be called with the same case as the function name.
10.beginPath () discards any currently defined paths and starts a new path. It sets the current point to (0,0).
When the environment of a canvas is first created, the Beginpath () method is called explicitly.
The 11.moveTo () method moves the upper-left corner of the window to a specified coordinate.
Grammar
Window.moveto (X,y)
Parameter description
x coordinates of the new position of the X window
Y-coordinate of the new position of the Y window
The 12.lineTo () method adds a new point, and then creates a line from that point to the last specified point in the canvas (the method does not create a line).
Tip: Use the stroke () method to draw the exact path on the canvas.
JavaScript Syntax:
Context.lineto (X,y);
Parameter values
Parameter description
x coordinates of the target position of the X path
The x-coordinate of the target position of the Y-path
13.<! DOCTYPE html>
<body>
<canvas id= "MyCanvas" width= "height=" "style=" border:1px solid #d3d3d3; >
Your Browser does not support the HTML5 canvas tag.
</canvas>
<script>
var C=document.getelementbyid ("MyCanvas");
var Ctx=c.getcontext ("2d");
Ctx.beginpath ();
Ctx.moveto (20,20);//Starting position
Ctx.lineto (20,100);
Ctx.lineto (70,100);//target position
Ctx.strokestyle= "Green";
Ctx.stroke ()//Draw out this line
</script>
</body>
C.strokestyle = "Red"; color of the border
The 15.floor () method performs a downward rounding calculation, which returns an integer that is less than or equal to the function parameter and that is the nearest approximation.
Math.floor (5.1) =5
The 16.random () method can return a random number between 0 ~ 1.
17.innerHTML in JS is bidirectional function: Gets the content of the object or inserts the content to the object;
such as: <div id= "AA" > This is the content </div> we can pass document.getElementById (' AA '). InnerHTML to get the embedded content of the object with ID AA;
You can also insert content into an object, such as document.getElementById (' abc '). Innerhtml= ' This is inserted content '; This allows you to insert content into an object with an ID of ABC.
18.<script type= "Text/javascript" >
var arr = new Array (3)
Arr[0] = "George"
ARR[1] = "John"
ARR[2] = "Thomas"
document.write (arr + "<br/>")
document.write (Arr.push ("James") + "<br/>")
document.write (arr)
</script>
Output:
George,john,thomas
4
George,john,thomas,james
The 19.setInterval () method can call a function or a calculation expression in the specified period (in milliseconds).
The SetInterval () method keeps calling the function until the clearinterval () is called or the window is closed. The ID value returned by SetInterval () can be used as an argument to the Clearinterval () method.
20. [] Array, which is an array element; {} object, which is an object element, () is generally the definition or invocation of the method, and the method parameter is set in the deduction number.
The 21.shift () method deletes the first element of the array and returns the value of the first element.
In this case, we'll create an array and delete the first element of the array. Note that this will also change the length of the array:
<script type= "Text/javascript" >
var arr = new Array (3)
Arr[0] = "George"
ARR[1] = "John"
ARR[2] = "Thomas"
document.write (arr + "<br/>")
document.write (Arr.shift () + "<br/>")
document.write (arr)
</script>
Output:
George,john,thomas
George
John,thomas
22. Some functions can be called when the page is loaded
For example, define a function a () {
}
Window.onload =
You can call function a when the page is loaded.
You can also window.onload = =function () {a (); b (); }
To invoke multiple methods
The 23.unshift () method adds one or more elements to the beginning of the array and returns a new length.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
