innerHTMLでタブ切り替え
各タブをクリックすれば内容を表示します。
innerHTML | outerHTML | insertAdjacentHTML | insertAdjacentText |
開始・終了タグに挟まれた部分のHTMLを設定したり、読み出す。
構文
object.innerHTML[ = innerHTML]
設定
この読み書き可能なプロパティは、テキストとHTMLタグの組み合わせになる。ただし、<html>、<head>、<title>タグは除く。
このプロパティを設定すると、指定した文字列で、エレメントの既存の内容を完全に置き換えてしまう。もし文字列にHTMLタグが含まれていた場合には、文字列は解釈されて、ドキュメントの中でそれが置かれるべきところにフォーマットされて配置される。
注 このプロパティはドキュメントがロード中に設定することはできない。設定する前にonloadイベントを待つようにしなければならない。TextRange、innerHTML、outerHTMLによってダイナミックにタグを作る場合には、新しく作成したタグのためのイベント作成にはJScriptを使用しなければならない。VBScriptはサポートされていない。
適用
A, ACRONYM, ADDRESS, B, BIG, BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, CITE, CODE, DD, DEL, DFN, DIR, DIV, DL, DT, EM, FIELDSET, FONT, FORM, H1, H2, H3, H4, H5, H6, I, IFRAME, IMG, INS, KBD, LABEL, LEGEND, LI, LISTING, MAP, MARQUEE, MENU, OL, P, PRE, Q, S, SAMP, SMALL, SPAN, STRIKE, STRONG, SUB, SUP, TH, TT, U, UL, VAR
関連事項:insertAdjacentHTMLメソッド
現在のエレメントとその内容をHTMLで設定したり、読み出す。
構文
object.outerHTML[ = outerHTML]
設定
この読み書き可能なプロパティは、テキストとHTMLタグの組み合わせである。ただし、<html>、<head>、<title>タグは除く。 このプロパティを設定すると、指定した文字列で、開始タグと終了タグも含めてエレメントの既存の内容を完全に置き換えてしまう。もし文字列にHTMLタグが含まれていた場合には、文字列は解釈されて、ドキュメントの中でそれが置かれるべきところにフォーマットされて配置される。
注 このプロパティはドキュメントがロード中に設定することはできない。設定する前onloadイベントを待つようにしなければならない。TextRange、innerHTML、outerHTMLによってダイナミックにタグを作る場合には、新しく作成したタグのためのイベント作成にはJScriptを使用しなければならない。VBScriptはサポートされていない。
適用
A, ACRONYM, ADDRESS, APPLET, AREA, B, BGSOUND, BIG, BLOCKQUOTE, BR, BUTTON, CENTER, CITE, CODE, COMMENT, DD, DEL, DFN, DIR, DIV, DL, DT, EM, EMBED, FIELDSET, FONT, FORM, H1, H2, H3, H4, H5, H6, HR, I, IFRAME, IMG, INPUT, INS, KBD, LABEL, LEGEND, LI, LISTING, MAP, MARQUEE, MENU, OBJECT, OL, P, PLAINTEXT, PRE, Q, S, SAMP, SELECT, SMALL, SPAN, STRIKE, STRONG, SUB, SUP, TABLE, TEXTAREA, TT, U, UL, VAR, XMP
関連事項:insertAdjacentHTMLメソッド
エレメントの中の指定された位置に、指定されたHTMLテキストを挿入する。テキストにHTMLタグが含まれる場合には、テキストは解析されフォーマットされてタグにしたがって表示される。
構文
object.insertAdjacentHTML(where, text)
<パラメータ 解説>
where HTMLテキストの挿入位置を指定する文字列で、以下のいずれかを指定できる。
BeforeBegin エレメントの直前にテキストを挿入する。
AfterBegin エレメントの開始位置の後にテキストを挿入する。ただし、そのエレメントの中の全てのコンテントよりも前に置かれる。
BeforeEnd エレメントの終了位置の直前にテキストを挿入する。ただし、そのエレメントの中の全てのコンテントよりも後に置かれる。
AfterEnd エレメントの終了位置の直後にテキストを挿入する。
text 挿入するHTMLテキストを指定する文字列。この文字列はテキストとHTMLタグの組み合わせになる。HTMLに誤りがあると、このメソッドは失敗する。
戻り値:戻り値なし。
注意事項
ドキュメントがロード中はテキストを挿入できない。このメソッドを呼ぶ前にonloadイベントを待たなければならない。
適用
A, ADDRESS, AREA, B, BASEFONT, BIG, BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, CITE, CODE, COMMENT, DD, DFN, DIR, DIV, DL, DT, EM, FIELDSET, FONT, FORM, FRAMESET, H1, H2, H3, H4, H5, H6, HR, I, IFRAME, IMG, INPUT, KBD, LABEL, LEGEND, LI, LISTING, MAP, MARQUEE, MENU, OL, OPTION, P, PLAINTEXT, PRE, S, SAMP, SCRIPT, SELECT, SMALL, SPAN, STRIKE, STRONG, STYLE, SUB, SUP, TD, TEXTAREA, TH, TR, TT, U, UL, VAR, XMP
関連事項
insertAdjacentTextメソッド、 innerHTMLプロパティ、 outerHTMLプロパティ
指定されたテキストをエレメントの中の指定された位置に挿入する。このメソッドはテキストをプレーンテキストとして挿入する。
構文
object.insertAdjacentText(where, text)
<パラメータ 解説>
where テキストの挿入位置を指定する文字列で、以下のいずれかを指定できる。
BeforeBegin エレメントの直前にテキストを挿入する。
AfterBegin エレメントの開始位置の後にテキストを挿入する。ただし、そのエレメントの中の全てのコンテントよりも前に置かれる。
BeforeEnd エレメントの終了位置の直前にテキストを挿入する。ただし、そのエレメントの中の全てのコンテントよりも後に置かれる。
AfterEnd エレメントの終了位置の直後にテキストを挿入する。
text 挿入するテキストを指定する文字列。
戻り値:戻り値なし。
注意事項
ドキュメントがロード中はテキストを挿入できない。このメソッドを呼ぶ前にonloadイベントを待たなければならない。
適用
A, ADDRESS, AREA, B, BASEFONT, BIG, BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, CITE, CODE, COMMENT, DD, DFN, DIR, DIV, DL, DT, EM, FIELDSET, FONT, FORM, FRAMESET, H1, H2, H3, H4, H5, H6, HR, I, IFRAME, IMG, INPUT, KBD, LABEL, LEGEND, LI, LISTING, MAP, MARQUEE, MENU, OL, OPTION, P, PRE, S, SAMP, SCRIPT, SELECT, SMALL, SPAN, STRIKE, STRONG, STYLE, SUB, SUP, TD, TEXTAREA, TH, TR, TT, U, UL, VAR
関連事項
insertAdjacentHTMLメソッド、 innerTextプロパティ、 outerTextプロパティ