ch_html_js
差分
この文書の現在のバージョンと選択したバージョンの差分を表示します。
| 両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン | ||
|
ch_html_js [2025/03/07 17:36] klab |
ch_html_js [2025/03/14 10:58] (現在) klab |
||
|---|---|---|---|
| ライン 9: | ライン 9: | ||
| </code> | </code> | ||
| - | 生成されたオブジェクトは「root:dom:タグ名」の子オブジェクトとなり、プログラム中のタグの部分は実行時には「root:dom:タグ名!"文字列"create」のように変換されて実行される。 | + | /*生成されたオブジェクトは「root:dom:タグ名」の子オブジェクトとなり、プログラム中のタグの部分は実行時には「root:dom:タグ名!"文字列"create」のように変換されて実行される。*/ |
| HTMLオブジェクトはメソッドやプロパティを持ち、タートルと同様に操作できる。既存のHTMLオブジェクトから新しいオブジェクトを作ることもできる。 | HTMLオブジェクトはメソッドやプロパティを持ち、タートルと同様に操作できる。既存のHTMLオブジェクトから新しいオブジェクトを作ることもできる。 | ||
| ライン 15: | ライン 15: | ||
| <code> | <code> | ||
| テスト＝<span>テキスト</span>。 | テスト＝<span>テキスト</span>。 | ||
| - | テスト！"red" backgroundColor。 | + | テスト！"red" 背景色。 |
| テスト２＝テスト！作る。 | テスト２＝テスト！作る。 | ||
| </code> | </code> | ||
| ライン 22: | ライン 22: | ||
| 1. タグに直接記述する方法 | 1. タグに直接記述する方法 | ||
| + | |||
| <code> | <code> | ||
| 要素＝<span id="hoge" style="color: blue;"></span>。 | 要素＝<span id="hoge" style="color: blue;"></span>。 | ||
| ライン 27: | ライン 28: | ||
| 2. メソッド呼び出しで設定する方法 | 2. メソッド呼び出しで設定する方法 | ||
| + | |||
| + | この例ではspanタグを作り、id属性にhogeを、CSSのcolorプロパティにblueを設定している。 | ||
| + | |||
| <code> | <code> | ||
| - | 要素＝<span></span>。 | + | 要素＝<span>テキスト</span>。 |
| - | 要素！"hoge" id。 | + | 要素！"hoge" 識別子。 |
| - | 要素！"blue" color。 | + | 要素！"blue" 文字色。 |
| </code> | </code> | ||
| ライン 36: | ライン 40: | ||
| <code> | <code> | ||
| - | 要素＝<span id="hoge"></span>。 | + | 要素＝<span id="hoge">テキスト</span>。 |
| - | 値＝要素！id?。 | + | 値＝要素！識別子?。 |
| </code> | </code> | ||
| ライン 72: | ライン 76: | ||
| - 特定のinputタグ（checkboxなど）：値が変更されたとき（onchange） | - 特定のinputタグ（checkboxなど）：値が変更されたとき（onchange） | ||
| - それ以外のタグ：クリックされたとき | - それ以外のタグ：クリックされたとき | ||
| + | |||
| + | イベント処理の定義には「動作設定」メソッドを使用することもできる。 | ||
| <code> | <code> | ||
| ボタン＝<button>送信</button>。 | ボタン＝<button>送信</button>。 | ||
| ボタン：動作＝「 | ボタン：動作＝「 | ||
| - | ラベル！"ボタンがクリックされました" 作る。 | + | <span>ボタンがクリックされました</span>。 |
| 」。 | 」。 | ||
| テキスト入力＝<input type="text">。 | テキスト入力＝<input type="text">。 | ||
| - | テキスト入力：動作＝「 | + | テキスト入力!「 |
| - | ラベル！（テキスト入力：value）テキスト。 | + | <span></span>！（テキスト入力!値?）テキスト。 |
| - | 」。 | + | 」 動作設定。 |
| </code> | </code> | ||
| ライン 100: | ライン 106: | ||
| <div id="output"></div>。 | <div id="output"></div>。 | ||
| 出力＝#output。 | 出力＝#output。 | ||
| - | 出力：テキスト＝"ID指定で取得した要素に内容を設定"。 | + | 出力!"ID指定で取得した要素に内容を設定" テキスト。 |
| </code> | </code> | ||
| ライン 118: | ライン 124: | ||
| <code> | <code> | ||
| フレーム＝<iframe></iframe>。 | フレーム＝<iframe></iframe>。 | ||
| - | フレーム：src＝"https://example.com/"。 | + | フレーム！"https://example.com/" ソース。 |
| </code> | </code> | ||
ch_html_js.1741336609.txt.gz · 最終更新: 2025/03/07 17:36 by klab
特に明示されていない限り、本Wikiの内容は次のライセンスに従います： CC Attribution-Share Alike 4.0 International
