web-dev-qa-db-ja.com

.NETでC#を使用してdivのCSSスタイルを編集する方法

コードビハインド(C#)でdivのIDを取得し、CSSを設定しようとしています。 DOMから取得できますか、何らかのコントロールを使用する必要がありますか?

<div id="formSpinner">
    <img src="images/spinner.gif" />
    <p>Saving...</p>
</div>
46
Jon Smock

runat="server"属性を使用すると、次のことができます。

<div id="formSpinner" runat="server">
    <img src="images/spinner.gif">
    <p>Saving...</p>
</div>

そのようにして、以下を使用してクラス属性にアクセスできます。

formSpinner.Attributes["class"] = "classOfYourChoice";

asp:Panelコントロールは、(少なくともレンダリングされたマークアップに関する限り)divとほぼ同義です。したがって、次のこともできます。

<asp:Panel id="formSpinner" runat="server">
    <img src="images/spinner.gif">
    <p>Saving...</p>
</asp:Panel>

これにより、次の記述が可能になります。

formSpinner.CssClass = "classOfYourChoice";

これにより、プロパティへのより明確なアクセスが可能になります。また、役に立つかもしれないし、そうでないかもしれない他のものがあります。

75
Rob

Divがrunat = "server"に設定されていることを確認してから、コードビハインドでそれを参照し、 "class"属性を設定します。

<div runat="server" id="formSpinner">
   ...content...
</div>

コードビハインド

formSpinner.Attributes["class"] = "class-name";
13
tvanfosson

この質問は私を緊張させます。サーバー側のコードを使用すると、ページのDOM状態にどのような影響があるかを理解していない可能性があります。

サーバー側のコードを実行するたびに、ページ全体がゼロから再構築されます。これにはいくつかの意味があります。

  • フォームがクライアントからWebサーバーに送信されます。これは、特にフォームに余分なフィールド(ViewState)が埋め込まれる可能性があるASP.Netで、Webブラウザーが実行できる最も遅いアクションに関するものです。些細な活動のためにあまりにも頻繁にそれを行うと、他のすべてがナイスでてきぱきしていても、アプリが遅く見えるようになります。
  • 帯域幅(アップストリームとダウンストリーム)およびCPU /メモリに関して、サーバーに負荷を追加します。ページの再構築に関連するすべてのことは、再び行わなければなりません。ページに動的コントロールがある場合は、それらを作成することを忘れないでください。
  • 最後のリクエスト以降にDOMに対して行ったことは、このリクエストに対して再度行うことを覚えていない限り、失われます。ページのDOMはreset

それをうまく処理できる場合は、これをJavaScriptにプッシュダウンし、ポストバックを回避することをお勧めします。おそらく、XmlHttpRequest()呼び出しを使用して、必要なサーバー側のアクションをトリガーします。

6
Joel Coehoorn

Runat = "server"属性をタグに追加すると、コードビハインドから参照できます。

3
Jeremy Frey

マークアップの要素にrunatを追加します

<div id="formSpinner" runat="server">
    <img src="images/spinner.gif">
    <p>Saving...</p>
</div

その後、formSpinner.Attributes( "class")を使用してコントロールのクラス属性にアクセスできます。これは文字列のみですが、編集できるはずです。

3
StingyJack

Runat = "server"なしでこれを行うにはどうすればよいですか?たとえば、あなたが持っている場合

<body runat="server" id="body1">

...そしてpdatepanel内から更新しようとしますが、決して更新されません。

ただし、通常の非サーバーHTMLコントロールとして保持することはできます。更新するJqueryは次のとおりです。

$("#body1").addClass('modalBackground');

しかし、コードビハインドでこれをどのように行いますか?

3
mokumaxCraig

IDが必要な場合、または単にビューステートに追加したくない場合に、コントロールをサーバーで実行したくない場合は、

<div id="formSpinner" class="<%= _css %>">
</div>

バックエンドで:

protected string _css = "modalBackground";
3
Peri

条件付きで<div>を表示または非表示にしたい場合は、それを<asp:panel>(divタグとしてhtmlにレンダリング)として宣言し、その.Visibleプロパティを設定できます。

1
Joel Coehoorn

Periの投稿とビューステートを使用したくない理由を拡張するには、次のコードを使用します。

style="<%= _myCSS %>"

Protected _myCSS As String = "display: none"

1
RandomUs1r