Asp.net动态加载css与js总结

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› ASP.NET›ASP.NET编程经验

原作者: [db:作者] 来自: [db:来源] 收藏邀请

我在项目的根目下建了一个名为和JScript.js和StyleSheet.css文件。前端页面放了一个Div和input。div用于使用样式，input用于测试js.

JScript.js的内容为：

function funMessageShow() {
alert("测试加载Js");
}

StyleSheet.css的内容为：

.testCss
{
background-color:Gray;
}

前端页面的html源码为：

    <form id="form1" runat="server">
    <div class="testCss">
        测试加载Css
    </div>
    <input id="btnShow" type="button" value="测试加载js" onclick="return funMessageShow();" />
    </form>

现在要从后台动态加载它们。

加载Css的主要代码为：

    /// <summary>
    /// 正常加载CSS
    /// </summary>
    /// <param name="pPage">要加载的页面</param>
    /// <param name="sStyleLink">样式url</param>
    public void LinkStyle(Page pPage, string sStyleLink)
    {
        System.Web.UI.HtmlControls.HtmlLink hlLink = new System.Web.UI.HtmlControls.HtmlLink();
        hlLink.Attributes.Add("rel", "stylesheet");
        hlLink.Attributes.Add("type", "text/css");
        hlLink.Attributes.Add("href", sStyleLink);
        Page.Header.Controls.Add(hlLink);

    }

加载Js的代码为 ：

    /// <summary>
    /// 正常加载Js
    /// </summary>
    /// <param name="pPage">要加载的页面</param>
    /// <param name="sJsUrl">js的url</param>
    public void LinkJs(Page pPage, string sJsUrl)
    {
        System.Web.UI.HtmlControls.HtmlGenericControl hgcLoadJs = new System.Web.UI.HtmlControls.HtmlGenericControl();
        hgcLoadJs.TagName = "script";
        hgcLoadJs.Attributes.Add("type", "text/javascript");
        hgcLoadJs.Attributes.Add("src", Page.ResolveClientUrl(sJsUrl)); //ResolveClientUrl:获取浏览器可以使用的 URL
        Page.Header.Controls.Add(hgcLoadJs);

    }

后台完整的代码如下，包含对是否已加载的判断代码。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            string sThisJsUrl = "JScript.js";
            string sThisStyleUrl = "StyleSheet.css";
            LinkStyle(this.Page, sThisStyleUrl);
            LinkJs(this.Page, sThisJsUrl);
            //ReferenceAjaxScript(this.Page, sThisJs);
            //ReferenceJs(this.Page, sThisJs, sThisJs);
            judgeCssExist(sThisStyleUrl);
            judgeJsExist(sThisJsUrl);
        }
    }



    #region 加载Css
    /// <summary>
    /// 正常加载CSS
    /// </summary>
    /// <param name="pPage">要加载的页面</param>
    /// <param name="sStyleLink">样式url</param>
    public void LinkStyle(Page pPage, string sStyleLink)
    {
        System.Web.UI.HtmlControls.HtmlLink hlLink = new System.Web.UI.HtmlControls.HtmlLink();
        hlLink.Attributes.Add("rel", "stylesheet");
        hlLink.Attributes.Add("type", "text/css");
        hlLink.Attributes.Add("href", sStyleLink);
        Page.Header.Controls.Add(hlLink);

    }
    //加css不同法，功能与上边方法相同
    public void LinkStyle2(Page pPage, string sStyleLink)
    {
        System.Web.UI.HtmlControls.HtmlGenericControl objLink = new System.Web.UI.HtmlControls.HtmlGenericControl();
        objLink.TagName = "link";
        objLink.Attributes["rel"] = "stylesheet";
        objLink.Attributes["type"] = "text/css";
        objLink.Attributes["href"] = sStyleLink;
        Page.Header.Controls.Add(objLink);
    }
    #endregion

    #region  加载Js
    /// <summary>
    /// 正常加载Js
    /// </summary>
    /// <param name="pPage">要加载的页面</param>
    /// <param name="sJsUrl">js的url</param>
    public void LinkJs(Page pPage, string sJsUrl)
    {
        System.Web.UI.HtmlControls.HtmlGenericControl hgcLoadJs = new System.Web.UI.HtmlControls.HtmlGenericControl();
        hgcLoadJs.TagName = "script";
        hgcLoadJs.Attributes.Add("type", "text/javascript");
        hgcLoadJs.Attributes.Add("src", Page.ResolveClientUrl(sJsUrl)); //ResolveClientUrl:获取浏览器可以使用的 URL
        Page.Header.Controls.Add(hgcLoadJs);

    }
    /// <summary>
    /// 加载js
    /// </summary>
    /// <param name="pPage">要加载的页面</param>
    /// <param name="sJsName">js名称</param>
    /// <param name="sJsUrl">js的Url</param>
    public void ReferenceJs(Page pPage,string sJsName,string sJsUrl)
    {
        Type tPage = Page.GetType();
        ClientScriptManager csmManager = Page.ClientScript;
        if (!csmManager.IsClientScriptIncludeRegistered(tPage, sJsName))
        {
            csmManager.RegisterClientScriptInclude(tPage, sJsName, Page.ResolveClientUrl(sJsUrl));
        }
    }
    #endregion

    /// <summary>
    /// 在Ajax方式下加载Js
    /// </summary>
    /// <param name="pPage">要加载的页面</param>
    /// <param name="sJsUrl">js的url</param>
    public void ReferenceAjaxScript(Page pPage, string sJsUrl)
    {
        ScriptReference srReference = new ScriptReference(sJsUrl);
        ScriptManager smManager = ScriptManager.GetCurrent(pPage);
        if (smManager != null)
        {
            smManager.Scripts.Add(srReference);
        }
    }

    /// <summary>
    /// 判断Css是否已加载
    /// </summary>
    /// <param name="sCssUrl">css url</param>
    private void judgeCssExist(string sCssUrl)
    {
        ControlCollection ccCollection = Page.Header.Controls;
        if (ccCollection.Count > 0)
        {
            foreach (Control cItem in ccCollection)
            {
                if (cItem.GetType() == typeof(System.Web.UI.HtmlControls.HtmlLink))
                {
                    System.Web.UI.HtmlControls.HtmlLink hlLink = cItem as System.Web.UI.HtmlControls.HtmlLink;
                    if (hlLink.Attributes["href"].ToString() == sCssUrl)
                    {
                        Response.Write("此CSS已存在，无须加载!<br/>");
                    }
                }
            }
        }
    }
    /// <summary>
    /// 判断js是否已加载
    /// </summary>
    /// <param name="sJsUrl">js url</param>
    private void judgeJsExist(string sJsUrl)
    {
        ControlCollection ccCollection = Page.Header.Controls;
        if (ccCollection.Count > 0)
        {
            foreach (Control cItem in ccCollection)
            {
                if (cItem.GetType() == typeof(System.Web.UI.HtmlControls.HtmlGenericControl))
                {
                    System.Web.UI.HtmlControls.HtmlGenericControl hgcControl = cItem as System.Web.UI.HtmlControls.HtmlGenericControl;
                    if (hgcControl.Attributes["src"].ToString() == sJsUrl)
                    {
                        Response.Write("此Js已存在，无须加载!<br/>");
                    }
                }
            }
        }
    }

}