我怎样才能在asp.net中划分脚本和样式?

时间:2012-06-29 11:58:45

标签: asp.net html mobile

我想根据用户代理(移动,即chrome-ff)划分我的样式和脚本。如何控制和允许包含或不包含?

也许是因为我可以使用< ! - [如果IE]> ,但其他人怎么样? 有人建议我plz,thx

 <head runat="server" id="head">
    <%--Only mobile--%>
      <link href="Styles/CommonMobile.css" rel="stylesheet" type="text/css"/>
      <link href="Styles/SiteMobile.css" rel="stylesheet" type="text/css"/>
      <script src="Scripts/CommonMobile.js" type="text/javascript"></script>
      <script src="Scripts/SiteMobile.js" type="text/javascript"></script>

    <%--All but IE --%>
      <link href="Styles/GeneralView.css" rel="stylesheet" type="text/css" />
      <script src="Scripts/GeneralView.js" type="text/javascript"></script>

    <%--Only IE --%>
      <link href="Styles/IE.css" rel="stylesheet" type="text/css" />
      <script src="Scripts/IE.js" type="text/javascript"></script>


   <%--Always--%>
      <link href="Styles/Common.css" rel="stylesheet" type="text/css" />
      <script src="Scripts/Common.js" type="text/javascript"></script>
</head>

3 个答案:

答案 0 :(得分:2)

一个很好的方法是使用Literal来扭曲它们并在后面的代码上打开它。我说Literal是因为它是可以在标题内运行的少数控件之一,并且不会留下额外的代码。

所以我这样做

 <asp:Literal runat="server" ID="OnlyIE" EnableViewState="false" Visible="false">
       <link href="Styles/IE.css" rel="stylesheet" type="text/css" />
      <script src="Scripts/IE.js" type="text/javascript"></script>
 </asp:Literal>

protected void Page_Load(object sender, EventArgs e)
{
    if (Request.Browser.Browser == "IE")
    {
        OnlyIE.Visible = true;
    }
}

[*]经过测试和工作。

另一种方法是再次使用Request.Browser.Browser并在Literal中再次完全呈现css和javascript,或者甚至更难使用Controls.Add创建控件,但所有这些都比代码多得多此

答案 1 :(得分:1)

您也可以从服务器端代码注册javascript和css。

如下所示

string source  = "mobile" // set your source over here i.e. mobile , IE , etc

if (source == "mobile")
{

  if (!Page.ClientScript.IsClientScriptIncludeRegistered(this.GetType(), "Common"))
  {
    Page.ClientScript.RegisterClientScriptInclude(this.GetType(), "Common", this.Page.ResolveClientUrl("~/Scripts/Common.js"));
  }
  if (!Page.ClientScript.IsClientScriptIncludeRegistered(this.GetType(), "Common"))
  {
     Page.ClientScript.RegisterClientScriptInclude(this.GetType(), "CommonCss", this.Page.ResolveClientUrl("~/Styles/Common.css"));
  }
}

希望这会帮助你..快乐编码

答案 2 :(得分:1)

一种更可靠的检测浏览器的方法。

var browser="";    
var isOpera = !!(window.opera && window.opera.version); // Opera 8.0+
 if(isOpera){
 string="opera"
 } 
var isFirefox = testCSS('MozBoxSizing');  // FF 0.8+
 if(isFirefox ){
 string="firefox"
 }               
var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
        // At least Safari 3+: "[object HTMLElementConstructor]"
 if(isSafari ){
 string="safari"
 }
var isChrome = !isSafari && testCSS('WebkitTransform');  // Chrome 1+
 if(isChrome ){
 string="chrome"
 }
var isIE = /*@cc_on!@*/false || testCSS('msTransform');  // At least IE6
 if(isIE){
 string="IE"
 }
 if(browser==""){
 browser="mobile";
 } 

var ss = document.createElement("link");
ss.type = "text/css";
ss.rel = "stylesheet";
if(browser=="IE"){
ss.href = "Styles/"+browser+".css";
}
else{
ss.href = "Styles/GeneralView.css";
}
if(browser=="mobile"){
ss.href = ss.href = "Styles/GeneralView.css";
var ss2 = document.createElement("link");
ss2.type = "text/css";
ss2.rel = "stylesheet";
ss2.href = var ss = document.createElement("link");
ss.type = "text/css";
ss.rel = "stylesheet";
ss.href = "style.css";
document.getElementsByTagName("head")[0].appendChild(ss);
}
document.getElementsByTagName("head")[0].appendChild(ss2);

    }
Similarly with javascript files.