.NET TIPS

[Silverlight 2]HTML要素の属性を追加/削除するには?[C#、VB]

デジタルアドバンテージ 一色 政彦
2009/11/12

 「TIPS:[Silverlight 2]HTML要素の属性を設定/取得するには?」では、Silverlightコントロールをホストしている基となるページのHTML DOM(Document Object Model)にアクセスして、任意のHTML要素が持つ任意の属性(Attribute)に値を設定、取得する方法を紹介した。Silverlightでは、任意の属性を追加、削除することもできる。

 次のサンプルでは、Silverlightアプリケーション上のボタンをクリックすると、HTMLのテーブル要素(=<table>要素)のheight属性(=高さの設定)を追加/削除する。

ここの高さが変更されます
Microsoft Silverlight を取得
HTML要素の属性を追加/削除するサンプル

■任意のHTML要素が持つ任意の属性を追加/削除する方法

 本稿では例として、次のようなHTML要素をあらかじめHTMLページ内に記述しているものとする。

<table id="targetID" height="50" width="400" bgcolor="#ff6666">
<tr><td>ここの背景色が変更されます</td></tr>
</table>
属性を追加/削除する対象となるHTML要素のHTMLコード例

 ここでは、この<table>要素のheight属性を追加/削除する。

 これには、HTML要素を表すHtmlElementクラス(System.Windows.Browser名前空間)のオブジェクトのSetAttributeメソッド/RemoveAttributeメソッドを呼び出す。SetAttributeメソッドは、「TIPS:[Silverlight 2]HTML要素の属性を設定/取得するには?」で紹介した、属性を設定するためのメソッドと同一である。

 HtmlElementオブジェクトを取得するには、ブラウザに表示されているHTMLドキュメントを表すHtmlDocumentクラス(System.Windows.Browser名前空間)のオブジェクトのGetElementByIdメソッドを呼び出せばよい。GetElementByIdメソッドは、引数としてHTML要素のid値(=id属性の値。この例では「targetID」)を(文字列で)受け取り、戻り値として該当HTML要素を表すHtmlElementオブジェクトを返す。

 この際に必要となるHtmlDocumentオブジェクトは、次のプロパティから取得できる。

HtmlPage.Document

 このように、ブラウザのHTML DOMにアクセスするためのHtmlPageクラス(System.Windows.Browser名前空間)には、HTMLドキュメント(=HtmlDocumentオブジェクト)を取得するための静的プロパティDocumentがある。

 先ほど示したSetAttributeメソッドは、第1引数として要素名を、第2引数としてその要素の値を(いずれも文字列で)受け取る。戻り値はない。

 またRemoveAttributeメソッドは、引数として要素名を(文字列で)受け取る。戻り値はない。

 次のコードは、SetAttributeメソッド/RemoveAttributeメソッドを利用する例だ。

private void ButtonAdd_Click(object sender, System.Windows.RoutedEventArgs e)
{
  HtmlElement htmlTextBox =
    HtmlPage.Document.GetElementById("targetID");

  htmlTextBox.SetAttribute("height", "100");
}

private void ButtonRemove_Click(object sender, System.Windows.RoutedEventArgs e)
{
  HtmlElement htmlTextBox =
    HtmlPage.Document.GetElementById("targetID");

  htmlTextBox.RemoveAttribute("height");
}
Private Sub ButtonAdd_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)

  Dim htmlTextBox As HtmlElement = _
    HtmlPage.Document.GetElementById("targetID")

  htmlTextBox.SetAttribute("height", "100")

End Sub

Private Sub ButtonRemove_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)

  Dim htmlTextBox As HtmlElement = _
    HtmlPage.Document.GetElementById("targetID")

  htmlTextBox.RemoveAttribute("height")

End Sub
HTML要素の属性を追加/削除するサンプル・コード(上:C#、下:VB)

 このコードを実行すると、冒頭のサンプル・アプリケーションと同じ実行結果になる。

 なお、HTML要素の属性の取り扱いや挙動は、ブラウザ間で異なる場合があるので注意してほしい。

■任意のHTML要素が持つstyle属性のCSSプロパティを追加/削除する方法

 「TIPS:[Silverlight 2]HTML要素のstyle属性のCSSプロパティを取得/設定するには?」では、HTML要素のstyle属性を取得/設定する方法を紹介している。そのstyle属性を追加/削除するには、SetStyleAttribute/RemoveStyleAttributeメソッドを使えばよい。使い方は、本稿で紹介したSetAttribute/RemoveAttributeメソッドと同じである。End of Article

カテゴリ:Silverlight 2 処理対象:HTML DOM
使用ライブラリ:HtmlElementクラス(System.Windows.Browser名前空間)
使用ライブラリ:HtmlDocumentクラス(System.Windows.Browser名前空間)
関連TIPS:[Silverlight 2]HTML要素の属性を設定/取得するには?
関連TIPS:[Silverlight 2]HTML要素のstyle属性のCSSプロパティを取得/設定するには?

この記事と関連性の高い別の.NET TIPS
[Silverlight 2]HTML要素の属性を設定/取得するには?
[Silverlight 2]HTML要素のstyle属性のCSSプロパティを取得/設定するには?
[Silverlight 2]HTML要素にフォーカスを設定するには?
[Silverlight 2]HTML要素のDOMプロパティを取得/設定するには?
[Silverlight 2]HTML要素のDOMメソッドを呼び出すには?
[Silverlight 2]HTML要素クリック時にSilverlightのメソッドを実行するには?
このリストは、(株)デジタルアドバンテージが開発した
自動関連記事探索システム Jigsaw(ジグソー) により自動抽出したものです。
generated by

「.NET TIPS」

@IT Special

- PR -

TechTargetジャパン

Insider.NET フォーラム 新着記事
  • 第2回 簡潔なコーディングのために (2017/7/26)
     ラムダ式で記述できるメンバの増加、throw式、out変数、タプルなど、C# 7には以前よりもコードを簡潔に記述できるような機能が導入されている
  • 第1回 Visual Studio Codeデバッグの基礎知識 (2017/7/21)
     Node.jsプログラムをデバッグしながら、Visual Studio Codeに統合されているデバッグ機能の基本の「キ」をマスターしよう
  • 第1回 明瞭なコーディングのために (2017/7/19)
     C# 7で追加された新機能の中から、「数値リテラル構文の改善」と「ローカル関数」を紹介する。これらは分かりやすいコードを記述するのに使える
  • Presentation Translator (2017/7/18)
     Presentation TranslatorはPowerPoint用のアドイン。プレゼンテーション時の字幕の付加や、多言語での質疑応答、スライドの翻訳を行える
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)
- PR -

イベントカレンダー

PickUpイベント

- PR -

アクセスランキング

もっと見る

ホワイトペーパーTechTargetジャパン

注目のテーマ

Insider.NET 記事ランキング

本日 月間
ソリューションFLASH