如何动态导入javascript和css文件

时间:2010-03-20 18:02:19

标签: java javascript css jsp servlets

我想根据某些条件导入给定的css或javascript文件,在我的Servlet中我有:


protected void doPost(...)
{
   if(condition)
   {
     //import some javascript or css file here
   }

}

我需要这种行为,因为我要导入的文件太多,文件名可能因条件而异。 有可能吗?

3 个答案:

答案 0 :(得分:4)

排序,是的。

boolean condition = evaluateItSomehow();
request.setAttribute("condition", condition);
request.getRequestDispatcher("/WEB-INF/page.jsp").forward(request, response);

然后在page.jsp中使用JSTL c:if

<head>
    <c:if test="${condition}">
        <link rel="stylesheet" type="text/css" href="style.css">
        <script type="text/javascript" src="script.js"></script>
    </c:if>
    ...
</head>

更新,因为您似乎有多个文件,您甚至可以通过设置所需的文件名后缀(或前缀,甚至整个名称,您的内容)使其更灵活等):

String suffix = evaluateItSomehow();
request.setAttribute("suffix", suffix);
request.getRequestDispatcher("/WEB-INF/page.jsp").forward(request, response);

<head>
    <link rel="stylesheet" type="text/css" href="style_${suffix}.css">
    <script type="text/javascript" src="script_${suffix}.js"></script>
    ...
</head>

如果您将suffix设置为"foo",则会加载style_foo.cssscript_foo.js。我认为这提供了足够的新见解。

答案 1 :(得分:1)

您是否尝试将Javascript和CSS插入dom?我会从客户端那样做。我的意思是,通过明确写出<script...><link...>的代码,可以成为。更好的方法是将一些内容发送回客户端,告诉它添加样式表或Javascript。

然后你可以动态添加它:

如果不需要动态完成,那就更容易了。只需设置一个标志,然后在JSP或ASP中检查标志的状态。在条件标记内,您将添加CSS和Javascript的代码。但是,我从你的问题中假设它是前者。

答案 2 :(得分:0)

function loadjscssfile(filename, filetype) {
            if (filetype == "js") { //if filename is a external JavaScript file
               // alert('called');
                var fileref = document.createElement('script')
                fileref.setAttribute("type", "text/javascript")
                fileref.setAttribute("src", filename)
                alert('called');
            }
            else if (filetype == "css") { //if filename is an external CSS file
                var fileref = document.createElement("link")
                fileref.setAttribute("rel", "stylesheet")
                fileref.setAttribute("type", "text/css")
                fileref.setAttribute("href", filename)
            }
            if (typeof fileref != "undefined")
                document.getElementsByTagName("head")[0].appendChild(fileref)
        }

调用此javascript函数动态加载css和js文件。在“filename”参数中传递名称完整的文件路径。