如何在Web视图页面上从本地存储调用css和js url

时间:2017-05-18 10:43:17

标签: javascript jquery html css

我有一个名为webview.html的网页,

当我进入此页面时,我希望它从本地存储加载其结构

这是保存在本地存储中的内容 -

<!DOCTYPE html>
<html lang="en">

<head>

  

    {{META}}

    
    <link rel="stylesheet" href="sources/template/css/bootstrap.min.css" type="text/css">

	
    <link rel="stylesheet" href="sources/template/css/common.css" type="text/css">


</head>

<body id="page-top">

    <div id="main-wrapper">
   
      {{CONTENT}}  

	  </div>
	  
	  
	     <!-- jQuery -->
    <script src="sources/template/js/jquery.js"></script>

    <!-- Bootstrap Core JavaScript -->
    <script src="sources/template/js/bootstrap.min.js"></script>

    <!-- Plugin JavaScript -->
    <script src="sources/template/js/jquery.easing.min.js"></script>
    <script src="sources/template/js/jquery.fittext.js"></script>
    <script src="sources/template/js/wow.min.js"></script>
 <script src="sources/template/js/popupimage.js"></script>
    <!-- Custom Theme JavaScript -->
   <script src="sources/template/js/creative.js"></script>
 <script src="sources/template/js/light-slider.js"></script>
<script src="sources/template/js/count.js"></script>
<script src="sources/template/js/menu.js"></script>
 <script src="sources/template/js/vertical_list.js"></script>
<script src="sources/template/js/sticky.js"></script>
<script src="http://www.jqueryscript.net/demo/jQuery-Plugin-For-One-Page-Navigation-Plugin-Page-Scroll-To-ID/jquery.malihu.PageScroll2id.js"></script>
<script>
	(function($){
		$(window).load(function(){
			$(".nav a").mPageScroll2id();
                                                $("#lightSlider").lightSlider();
			 callCounter();
			 callvertical_list();
			  $(".menu2").sticky({ topSpacing: 0 });
		});
	})(jQuery);
</script>
</body>

</html>

加载此结构后,我希望它加载html代码,该代码也保存在本地存储中。我希望它加载编写{{CONTENT}}的代码。请帮忙

1 个答案:

答案 0 :(得分:0)

section232 localStorage变量中设置此项:

"<!DOCTYPE html>\r\n<html lang=\"en\">\r\n\r\n  <head>\r\n\r\n\r\n\r\n    {{META}}\r\n\r\n\r\n    <link rel=\"stylesheet\" href=\"sources/template/css/bootstrap.min.css\" type=\"text/css\">\r\n\r\n\r\n    <link rel=\"stylesheet\" href=\"sources/template/css/common.css\" type=\"text/css\">\r\n\r\n\r\n  </head>\r\n\r\n  <body id=\"page-top\">\r\n\r\n    <div id=\"main-wrapper\">\r\n\r\n      {{CONTENT}}\r\n\r\n    </div>\r\n\r\n\r\n    <!-- jQuery -->\r\n    <script src=\"sources/template/js/jquery.js\"></script>\r\n\r\n    <!-- Bootstrap Core JavaScript -->\r\n    <script src=\"sources/template/js/bootstrap.min.js\"></script>\r\n\r\n    <!-- Plugin JavaScript -->\r\n    <script src=\"sources/template/js/jquery.easing.min.js\"></script>\r\n    <script src=\"sources/template/js/jquery.fittext.js\"></script>\r\n    <script src=\"sources/template/js/wow.min.js\"></script>\r\n    <script src=\"sources/template/js/popupimage.js\"></script>\r\n    <!-- Custom Theme JavaScript -->\r\n    <script src=\"sources/template/js/creative.js\"></script>\r\n    <script src=\"sources/template/js/light-slider.js\"></script>\r\n    <script src=\"sources/template/js/count.js\"></script>\r\n    <script src=\"sources/template/js/menu.js\"></script>\r\n    <script src=\"sources/template/js/vertical_list.js\"></script>\r\n    <script src=\"sources/template/js/sticky.js\"></script>\r\n    <script src=\"http://www.jqueryscript.net/demo/jQuery-Plugin-For-One-Page-Navigation-Plugin-Page-Scroll-To-ID/jquery.malihu.PageScroll2id.js\"></script>\r\n    <script>\r\n      (function($) {\r\n        $(window).load(function() {\r\n          $(\".nav a\").mPageScroll2id();\r\n          $(\"#lightSlider\").lightSlider();\r\n          callCounter();\r\n          callvertical_list();\r\n          $(\".menu2\").sticky({\r\n            topSpacing: 0\r\n          });\r\n        });\r\n      })(jQuery);\r\n\t\t\t\r\n\t\t\t$(document).ready(function(){\r\n\t\t\t\tif(localStorage.getItem(\"ttype\") != undefined){\r\n\t\t\t\t\t$(\"#main-wrapper\").html(localStorage.getItem(\"ttype\"));\r\n\t\t\t\t}\r\n\t\t\t});\r\n\r\n    </script>\r\n  </body>\r\n\r\n</html>\r\n"

在localStorage ttype中准备好您的内容。

webview.html 中设置以下代码:

document.write(sessionStorage.getItem("section232"));