C#からHTMLを変更する

Blazor WebAssembly アプリケーションで HTML を動的に変更します。 まず、C# を呼び出して 変更を行います。 「文字を更新」をクリックすると、 このように Hello Blazor の文字が 変更されました。 この後紹介しますが、 こちらは C# のコードで 変更を行っています。 もうひとつ、こちらは JavaScript で変更を行います。 このようにボタンを押すと、 文字が変更されました。 この処理は C# から JavaScript を呼び出すという 処理を行っています。 それでは、実際のコードを 確認してみましょう。 C# で HTML を変更している コードです。 button タグに設定された @onclick という Razor 構文で UpdateMessage という メソッドを呼び出しています。 この UpdateMessage は 同じファイルの@code から 始まる部分に記述されています。 UpdateMessage の中では 変数 Hello の中身の 文字列を変更しています。 この変数 Hello 16 行目で定義されている変数ですが、 こちらは ＠hello という コードに埋め込まれています。 ＠hello はこのように onclick というボタンが押されたときの 処理を介して、 C＃ コードを実行することで、 変更されます。 もう一方の JavaScript で 変更しているコードを 確認しましょう。 こちらにも同じく button タグに @onclick という コードが記述されており、 UpdateHtml という メソッドを呼び出しています。 この UpdateHtml も C# で書かれており、 その中で JsRuntime.InvokeVoidAsync というメソッドを呼び出しています。 この処理により、 JavaScript のメソッドを 呼び出しています。 JavaScript の同じ名前の UpdateHtml を呼び出している というコードです。 変数の JSRuntime は ９行目で定義さています。 Blazor のコンポーネントの中で JavaScript を記述することは できません。 例えばここで script タグを利用しようとします。 JavaScript は…