使用Javascript通过菜单创建HTML动态页面_Javascript_Jquery_Html_Dom_Web Applications

使用Javascript通过菜单创建HTML动态页面

javascript jquery html dom web-applications

使用Javascript通过菜单创建HTML动态页面,javascript,jquery,html,dom,web-applications,Javascript,Jquery,Html,Dom,Web Applications,我有一个包含菜单的html页面的网站应用程序当我按下按钮时，显示必须执行哪些操作的参数会添加到url中例如…html？操作=显示图表我希望通过使用JS读取这些参数，为每个实例动态创建页面主体我想过那样的事 html代码： <html> <head> <title>Bull Stock | Home</title> <meta charset="UTF-8"> <me

我有一个包含菜单的html页面的网站应用程序

当我按下按钮时，显示必须执行哪些操作的参数会添加到url中

例如…html？操作=显示图表

我希望通过使用JS读取这些参数，为每个实例动态创建页面主体

我想过那样的事

html代码：

<html>
    <head>

        <title>Bull Stock | Home</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
        <link rel="icon" href="images/favicon.ico" type="image/x-icon">
    </head>
    <body onload="updateBodyOnAction()">
        <script>
            function getUrlValue(VarSearch){
                var SearchString = window.location.search.substring(1);
                var VariableArray = SearchString.split('&');

                for(var i = 0; i < VariableArray.length; i++){
                    var KeyValuePair = VariableArray[i].split('=');
                    if(KeyValuePair[0] === VarSearch){
                        return KeyValuePair[1];
                    }
                }
            }
        </script>
        <script>
        function updateBodyOnAction() {
                  if(window.location.toString().indexOf("?") > -1){
                        var action = getUrlValue("action");

                        if(action.valueOf() === "show-charts"){
                            document.write("<h1 align=\"center\">CHARTS!</h1>"+
                                    "<p align=\"center\">More Charts!</p>");
                        }

                  }
              }
        </script>
    </body>
</html>

或

使用appendChild方法

但我想知道这是否正确，是否有更好的方法，或者对这一方法的改进有帮助，谢谢