js中的local Storage緩存

標簽：

JavaScript

原先只是感觉缓存很麻烦，上网查了一大堆资料，后来无意间自己写了一次，才突然觉得也就是三行代码的事情，或许最难的事，就是未知的！

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>js本地缓存</title>
    </head>
    <body>
        <div>我是缓存的内容！</div>
        <script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="lib/js/jquery.min.js"></script>
        <script type="text/javascript">
            /*创建缓存*/
            var htmlBox=$("div").html();
            localStorage.setItem("lyID",htmlBox);//给需要缓存的内容定义一个名称
            /*读取缓存*/
            localStorage.getItem("lyID");
            console.log(localStorage.getItem("lyID"));
            /*清空缓存*/
            localStorage.removeItem("lyID");
        </script>
    </body>
</html>

缓存内容如图，此方法在ajax跨页面传值的时候特别实用，只是ie8不兼容！

點擊查看更多內(nèi)容