简单的HTML5 Web Storage留言册

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>HTML5 WebStorage 留言本title>
    <script type="text/javascript">
        // JavaScript Document
        function savelocalStorage(id) {
            var data = document.getElementById(id).value;
            var time = new Date().getTime();
            localStorage.setItem(time, data);
            loadlocalStorage('msg');
        }

        function loadlocalStorage(id) {
            var result = '';
            for (var i =0; i < localStorage.length; i++) {
                var key = localStorage.key(i);
                var value = localStorage.getItem(key);
                var date =new Date();
                date.setTime(key);
                var datestr = date.toGMTString();
                result +='';
            }
            result +='
' + value + '' + datestr + '
'; var target = document.getElementById(id); target.innerHTML = result; } function clearlocalStorage() { localStorage.clear(); loadlocalStorage('msg'); alert("localStorage留言已被清除!"); } script> head> <body> <h3>HTML5 WebStorage 留言本h3> <textarea id="demo" cols="60" rows="10">textarea><br/> <input type="button" value="留言" onclick="savelocalStorage('demo');"/> <input type="button" value="清除留言" onclick="clearlocalStorage('msg');"/> <hr/> <p id="msg">p> body> html>

简单的HTML5 Web Storage留言册_第1张图片

转载于:https://www.cnblogs.com/dsfderek/archive/2012/05/03/2480754.html

你可能感兴趣的:(简单的HTML5 Web Storage留言册)