学习html5开发,应该遵循那几个步骤!

发布网友发布时间：2022-05-12 04:22

共2个回答

懂视网时间：2022-05-12 08:43

web留言记事本的开发

！！！！！代码如下

index.html的代码

<!DOCTYPE html><html lang="en"><head>
 <meta charset="UTF-8">
 <title>H5表格提交</title>
 <script src="appWeb.js"></script></head><body>
 <p id="msg"></p>
 <textarea id="memo" cols="60" rows="10"></textarea><br/>
 <input type="button" value="追加数据" onclick="saveStorage('memo')">
 <input type="button" value="删除数据" onclick="clearStorage()"></body></html>

js的代码

function saveStorage(id){
 var data = document.getElementById(id).value; var time = new Date().getTime();
 localStorage.setItem(time,data);
 loadStorage('msg');
}function loadStorage(id){
 var result = "<table border = '1'>"; for(var i = 0;i < loadStorage.length;i++){ var key = localStorage.key(i); var value = localStorage.getItem(key); var date = new Date();
 date.setTime(key);
 result += "<tr><td>"+value+"</td><td>"+date+"</td></tr>";
 }
 result += "</table>"; var target = document.getElementById(id);
 target.innerHTML = result;
}function clearStorage(){
 localStorage.clear();
 loadStorage('msg');
}

！！！！效果图

这里写图片描述

web留言记事本的开发

！！！！！代码如下

index.html的代码

<!DOCTYPE html><html lang="en"><head>
 <meta charset="UTF-8">
 <title>H5表格提交</title>
 <script src="appWeb.js"></script></head><body>
 <p id="msg"></p>
 <textarea id="memo" cols="60" rows="10"></textarea><br/>
 <input type="button" value="追加数据" onclick="saveStorage('memo')">
 <input type="button" value="删除数据" onclick="clearStorage()"></body></html>

js的代码

function saveStorage(id){
 var data = document.getElementById(id).value; var time = new Date().getTime();
 localStorage.setItem(time,data);
 loadStorage('msg');
}function loadStorage(id){
 var result = "<table border = '1'>"; for(var i = 0;i < loadStorage.length;i++){ var key = localStorage.key(i); var value = localStorage.getItem(key); var date = new Date();
 date.setTime(key);
 result += "<tr><td>"+value+"</td><td>"+date+"</td></tr>";
 }
 result += "</table>"; var target = document.getElementById(id);
 target.innerHTML = result;
}function clearStorage(){
 localStorage.clear();
 loadStorage('msg');
}

！！！！效果图

这里写图片描述

热心网友时间：2022-05-12 05:51

个人意见：
基础部分：
第一：掌握html,dom,bom的基本知识。
第二：掌握Javascript的基本知识。
第三：掌握html5的新特性。
如果想提高
掌握Javascript高级编程。
至少掌握一种Javascript编程框架如JQuery.
如果想搭建整个的开发
需要熟悉服务器的开发以及数据库的使用
就这些吧，希望能对你有用。