利用HTML和JAVASCRIPT解决C语言模式下文本界面的操作快速图形化转化。把代码用记事本保存为html文件用IE打开即可运行。
1.最简单的HTML文件
<html>
<title>小游戏</title>
<head>
</head>
<body>
<p>最简单的HTML文件！静态网页不能交互，成对出现的是HTML元素，＜html＞＜/html＞表示是网页＜title＞扫雷＜/title＞
＜head＞
＜/head＞＜body＞＜/body＞</p>
</body>
</html>
2.form表单，实现交互，javascript提供函数脚本
<html>
<title>小游戏</title>
<script type="text/javascript">
var ctime=0
var ttime
function timedCount()
{
document.getElementById('but1').disabled="disabled"
document.getElementById('timetxt').value=ctime
ctime=ctime+1
ttime=setTimeout("timedCount()",1000)
}
</script>
<body>
<form>
<input type="button" value="开始" onClick="timedCount()" id="but1">
<input type="text" id="timetxt">
</form>
<p>引入了form表单，实现交互！元素input输入信息，两种类型：按钮和文本框，id为识别符</p>
</body>
</html>
2.1求输入数的阶乘
<html>
<title>扫雷</title>
<script type="text/javascript">
function fun1()
{
var i,j=1,n=0;
n=document.getElementById('timetxt').value
for(i=1;i<=n;i++)
j=j*i;
document.getElementById('timetxt').value=j
}
</script>
<body>
<form>
<input type="button" value="开始" onClick="fun1()" id="but1">
<input type="text" id="timetxt">
</form>
<p>引入了form表单，实现交互！元素input输入信息，两种类型：按钮和文本框，id为识别符,求输入数的阶乘</p>
</body>
</html>
3.鼠标和相应事件相应
<html>
<title>小游戏</title>
<script type="text/javascript">
function show_coords(event)
{//整除的含义和C语言不同，用函数parseInt(）
x=parseInt(event.clientX)
y=parseInt(event.clientY)
alert("X 坐标: " + x + ", Y 坐标: " + y)
if (event.button==2)
alert("您点击了鼠标右键！")
else
alert("您点击了鼠标左键！")
}
</script>
<body οnmοusedοwn="show_coords(event)">
<p>鼠标和相应事件相应</p>
</body>
</html>
4.表格和鼠标和相应事件
<html>
<title>小游戏</title>
<script type="text/javascript">
function show_coords(event)
{
x=parseInt(event.clientX)
y=parseInt(event.clientY)
alert("X 坐标: " + x + ", Y 坐标: " + y)
if (event.button==2)
alert("您点击了鼠标右键！")
else
alert("您点击了鼠标左键！")
}
</script>
<body >
<table οnmοusedοwn="show_coords(event)" border="1" width="120" >
<tr><td>1</td><td>□</td><td> </td></tr>
<tr><td>1</td><td>□</td><td> </td></tr>
</table >
<p>表格和鼠标和相应事件</p>
</body>
</html>
4.1 增强表格，背景图，表格单元的访问、设置
<html>
<title>扫雷</title>
<script type="text/javascript">
function show_coords(event)
{
x=parseInt(event.clientX/40)+1
y=parseInt(event.clientY/40)+1
var x1=document.getElementById('myTable').rows[y-1].cells
x1[x-1].innerHTML=(y-1)*3+x
// "<img src='1.jpg'>"在一个格内显示图标
}
</script>
<body >
<table id="myTable" οnmοusedοwn="show_coords(event)" border="1" width="120" background="jing.jpg">
<tr height="40"><td>0</td><td>0</td><td>0</td></tr>
<tr height="40"><td>0</td><td>0</td><td>0</td></tr>
<tr height="40"><td>0</td><td>0</td><td>0</td></tr>
</table >
<p>表格和鼠标和相应事件</p>
</body>
</html>
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
