プログラミング言語「ドリトル」

大阪電気通信大学 兼宗研究室

ユーザ用ツール

サイト用ツール


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" ​背景色
  ​テスト2=テスト!作る。  ​テスト2=テスト!作る。
 </​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