JavaScript游戏开发

gaohaikuo1 · 发表于 7 天前

1.什么是JavaScript
有浏览器的地方就有JavaScript。那么什么是JavaScript呢？JavaScript 是世界上最流行的脚本语言，它适用于PC、笔记本电脑、平板电脑和手机。JavaScript 是一种轻量级的编程语言，JavaScript 是可插入HTML 页面的代码，JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行，JavaScript 很容易学习，没有想象中的那么复杂。

js基础知识https://zhuanlan.zhihu.com/p/531960040

gaohaikuo1 · 发表于 7 天前

2.那什么又是html呢？

html实际就是网页代码本身，里面描述了网页有什么字，有什么图片，放在什么位置等。

gaohaikuo1 · 发表于 7 天前

3.第一个html程序

<html>
<body >
你好呀！
</body>
</html>

复制代码

这个代码很简单，首先看到很多诸如<>和<\>的字符，这是html语言的语法结构，都是成对出现的，就像是括号一样
比如<html>和</html>之间包含的是整个的网页文件，<body>和</body>之前包含的是代码主体，而代码主体又隶属于网页文件。

操作：
在D盘建立一个文件夹，命名code
在里面新建一个txt文件。命名h.txt, 打开后把上面的代码贴进去,另存为h.html
在h.html上点击右键打开方式选择浏览器，就能看到结果啦

qing6939 · 发表于 7 天前

在什么页面敲代码

qing6939 · 发表于 7 天前

gaohaikuo1 发表于 2025-3-28 12:04
2.那什么又是html呢？

什么是？

gaohaikuo1 · 发表于 7 天前

qing6939 发表于 2025-3-28 12:27
在什么页面敲代码

直接建立文本文件输入代码即可

gaohaikuo1 · 发表于 7 天前

这个教程不错，备忘“https://blog.csdn.net/weixin_42452483/article/details/144327777

gaohaikuo1 · 发表于 7 天前

练习3：在html中画一个红色的方框：

<html>
<body>
<canvas id="gameCanvas" width="800" height="600"></canvas>
<script>
var canvas = document.getElementById('gameCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = 'red';
ctx.fillRect(100, 100, 200, 200);
</script>
</body>
</html>

复制代码

这句稍微复杂，一句一句来
语句1：<canvas id="gameCanvas" width="800" height="600"></canvas>
这句的意思加了一个canvas，也就是画布，可以用来画画，它的身份证号码id是"gameCanvas"，宽度是800，高度是600

接下来是跟着一个<script></script>包着的脚本，这就是javascript部分

语句2：var canvas = document.getElementById('gameCanvas');
var表示定义一个变量，名字叫 canvas,它是文档（document)，通过（by）身份证（id）'gameCanvas'找到的（get）元素（Element）

语句3：var ctx = canvas.getContext('2d');
在canvas里建立一个上下文环境ctx，可以理解为画笔，用来画画

语句4：ctx.fillStyle = 'red';
ctx的填充（fill）方式(style)为红色（red）
ctx.fillRect(100, 100, 200, 200);
填充（fill）矩形（rect，是rectangle的缩写），坐标x为100，y为100，宽度为200，高度为200

gaohaikuo1 · 发表于 6 天前

这是注释版

<html>
<body>
<canvas id="gameCanvas" width="800" height="600"></canvas>
<script>
//通过id找到画板对象，命名为cancas
var canvas = document.getElementById('gameCanvas');
//在画板上建立一个画笔，命名为ctx
var ctx = canvas.getContext('2d');
//笔的颜色设置为红色
ctx.fillStyle = 'red';
//用笔画一个矩形
ctx.fillRect(100, 100, 200, 200);
</script>
</body>
</html>

复制代码

		自动登录	找回密码
密码			立即注册

JavaScript游戏开发

点评

浏览过的版块