JavaScript 1.! DOM Ajax Shelley Powers,, JavaScript David Flanagan, JavaScript 2

Similar documents
untitled

ÉvÉçPM_02

演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用できます ) 演習名 使用するフォルダ 演習 1 Z: Web データ管理 演習

カンペキな初心者のための、Adobe® AIR™の基礎の基礎

スライド タイトルなし

ch31.dvi

Web プログラミング 1 JavaScript (4) (4 章 ) 2013/7/17( 水 ) 日時 講義内容 4/10 ( 水 ) ガイダンス Web (1 章 ) 4/17 ( 水 ) HTML+CSS (1) (2 章 ) 4/24 ( 水 ) HTML+CSS (2) (2 章 ) 5

第 2 部 JavaScript 編 17 演習の答え 17.1( 演習 3-3)1 列目の width を 200px 2 列目を 300px にしなさい pr3-3.html <title> </title> <table border="1" style="border-collapse:co

SVG資料第10回目(その2) Ajaxによる同期通信と非同期通信の違い

javascript key

CodeIgniter Con 2011, Tokyo Japan, February


Web データ管理 JavaScript (1) (4 章 ) 2011/12/7( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/21

( )

Microsoft PowerPoint _2b-DOM.pptx

untitled

スライド 1

AJAXを使用した高い対話性を誇るポートレットの構築

インターネットマガジン2001年9月号―INTERNET magazine No.80

JavaScript演習

GIMP

第7回 Javascript入門

SVG資料第6回目(その3) SVGとHTMLの間でデータを交換する

d_appendixB-asp10appdev.indd

JavaScript¥×¥í¥°¥é¥ß¥ó¥°ÆþÌç

Java学習教材

paper.pdf

医療者のための情報技術入門第 9 回プログラムがはたらくしくみを学ぶ (2) 日紫喜光良 概要 1. はじめに- 具体例から ここから Javascript のプログラミング入門 次はどうする--

07_経営論集2010 小松先生.indd

Webデザイン論

GIMP

untitled

~/WWW-local/compIID (WWW IID ) $ mkdir WWW-local $ cd WWW-local $ mkdir compiid 3. Emacs index.html n (a) $ cd ~/WWW/compIID

untitled

やさしいJavaプログラミング -Great Ideas for Java Programming サンプルPDF

1

8 if switch for while do while 2

JavaScript の使い方

soturon2013

JavaScript演習

SmartBrowser_document_build30_update.pptx

携帯電話でGoogle Mapsを使う

</ul> (XXX ) 15 ( )15 35 (XXX ) 15 ( ) [4] HTML HTML HTML HTML 1. <!--- CONTENTS_TITLE_TABLE ---> <b><font size=+1>xxx </font></b> <sm

インターネットマガジン2001年2月号―INTERNET magazine No.73

Java演習(4) -- 変数と型 --

chap04.indd

JavaScript 演習 2 1

インターネット社会の発展

フォームとインナー HTML を使って動的にページ内の文章を変更しよう 問題 1. つぎの指示と画面を参考に HTML を組みなさい 仕様 テキストボックスに任意の文字を入力し [ コメント ] ボタンをクリックすると 下部の文章がテキストボックスの内容に置き換わる フォーム名 : f1 テキストボ

Microsoft Word - W3C's_ARIA_Support

NetworkApplication-09

第7回 Javascript入門

演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用できます ) 講義で使うフォルダ 2/23

6 2 1

ななちゃんの IT 教室 メニューを極めようの巻 by ななちゃんが メニューの使い方をマスターするというお話 第 0.1 版 2017 年 6 月 23 日 フリー素材 いらすとやフリー素材 h

K227 Java 2

演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用できます ) Web プログラミング 1 CGI (3 章 ) 2012/6/12( 水 ) 講義

19 ステップで 2 大人気スクリプト言語を学ぶ GUI のあるアプリを作る STEP11 から STEP12 までまとめ 1.Python での GUI アプリ作成 Python は標準ではグラフィックスの機能を持ちませんが ライブラリを使うことで GUI のアプリを作成することができる そこで

Servlet/JSP ( 作成中 ) 2010 年 x 月 x 日作成 Firebird 日本ユーザー会 Naoyuki Sano 1

Web データ管理 JavaScript (3) (4 章 ) 2011/12/21( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/18

016-22_ŒÚ”Ł

スライド 1

e10s におけるプロセス間通信の基本 219 HACK #34 Components.manager.removeBootstrappedManifestLocati on() function shutdown(adata, areason) { const IOService =

PowerPoint プレゼンテーション

forever朝活

div: 3 span: 4 h1,..., h6: (heading) h1 h2 </tag1> table: table tr (table row) tr td (table data) ol, ul: (ordered) (unordered) </tag4> 1: HTML

解きながら学ぶJava入門編

fuga scanf("%lf%*c",&fuga); 改行文字を読み捨てる 10 進数の整数 おまじない取り込んだ値を代入する変数 scanf( %d%*c,&hoge); キーボードから取り込め という命令 1: scanf 1 1: int double scanf %d %lf printf

Java updated

10/ / /30 3. ( ) 11/ 6 4. UNIX + C socket 11/13 5. ( ) C 11/20 6. http, CGI Perl 11/27 7. ( ) Perl 12/ 4 8. Windows Winsock 12/11 9. JAV

前ページからの続き // テキストボックス02 id 属性で取得 // id 属性で取得する場合は一意に決まるので 何番目かの指定は不要 var textbox02elem = document.getelementbyid("text_box02_id"); if ("001" == statee

PowerPoint プレゼンテーション

新・明解Java入門

PowerPoint プレゼンテーション

医療者のための情報技術入門第 10 回プログラムがはたらくしくみを学ぶ (3) 日紫喜光良 概要 1. はじめに- 具体例から- 2.Javascript のプログラミング入門 ここから 足りないものは借りてくる-Javascrip


インターネットマガジン1999年7月号―INTERNET magazine No.54

東京工業大学情報理工学院 AO 入試 活動実績報告書 氏名 ( よみ ): 大岡山花子 ( おおおかやまはなこ ) 高等学校 : 県立 高等学校 (2019 年 3 月 卒業 卒業予定 ) 活動実績概要 (150 字程度 ): JavaScript ではコールバックを多用することがある. これはプロ

Microsoft PowerPoint _1a-HTML.pptx

ジョインポイント写像に基づく ドメイン特化AO機構の開発手法

コンテンツメディアプログラミング実習2

ii II Web Web HTML CSS PHP MySQL Web Web CSS JavaScript Web SQL Web

ohp03.dvi

Web±ÜÍ÷¤Î³Ú¤·¤µ¤ò¹â¤á¤ëWeb¥Ú¡¼¥¸²ÄÄ°²½¥·¥¹¥Æ¥à

インターネットマガジン1999年10月号―INTERNET magazine No.57

I 11

インターネットマガジン2000年2月号―INTERNET magazine No.61

を使った アナログ スイッチ回路基板 組み立ての書 作 : じむ Twitter はじめに : 回路を組み立てる にあたっての注意事項 1. 本回路基板を組み立てるには 電子工作 や 電子回路 ソフトウエア についての一般的な知識や工作環境などが必要です 電

Webデザイン論

Microsoft PowerPoint - 04WWWとHTML.pptx

World Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML

forever朝活

第7回 Javascript入門

r07.dvi

WebGL *1 DOM API *1 X LR301 Kageyama (Kobe Univ.) Visualization / 37

ohp07.dvi

インターネットマガジン2001年4月号―INTERNET magazine No.75


vuejs_meetup.key

1. A0 A B A0 A : A1,...,A5 B : B1,...,B

Transcription:

JavaScript (2) 1

JavaScript 1.! 1. 2. 3. DOM 4. 2. 3. Ajax Shelley Powers,, JavaScript David Flanagan, JavaScript 2

(1) var a; a = 8; a = 3 + 4; a = 8 3; a = 8 * 2; a = 8 / 2; a = 8 % 3; 1 a++; ++a; (++ var b = ++a; b a+1 var b = a++ b a ) 1 a--; --a; var b = -a; a += 8; a -= 3; a *= 4; a /= 2; a = a + 8; a = a 3; a = a * 4; a = a / 2; 3

(2) if( ) { A } else { B } A B if( 1) { A } else if ( 2) { B } else if( 3) { C } else { D } 1 A 2 B 3 C D switch( ) { case 1: A [break;] case 2: B [ break;] default: C } 1 A 2 B C break A B C 4

(3) while( ) { A } A do { A } while( ) A A for( A; ; B){ C } 1. A 2. C 3. B 2 for( in ) {.. } 5

(4) if (a == 3) # if( a = 3 ) if ( a!= 3) if ( a > 3 ) if ( a < 3) if( a >= 3) if( a <= 3) AND if ( (a > 3) && (a < 10) ) OR if( (a <3) (a > 10)) if(!(a < 3)) 6

(true, false) const HOGE = 3; null ( ) document.writeln(b); If( x ) (=null ) undefined ( undefined ) var a; document.writeln(a); 7

( ) function plus(x, y) { return x + y; } document.writeln(plus(3, 4)); ( ) var f = function(x, y) { return x + y; } document.writeln(f(5,6)); ) var f = new Function( x, y, return x + y ); document.writeln(f(7,8)); 8

var a = new Array( one, two ); var a = [ one, two ]; a.push( three ); var elem = a.pop(); // Var len = a.length(); // var arr = [ a, b, c, d, e ]; shift unshift a b c d e push pop 9

JavaScript JavaScript var edic = new Object(); edic[ orange ] = ; edic[ apple ] = ; document.writeln(edic[ orange ]); var jdic = new Object(); jdic[ ] = orange ; jdic[ ] = apple ; var edic = { orange :, apple : }; document.writeln(edic.orange); 10

var point = new Object(); point.x = 100; point.y = 200; point.move = function(newx, newy) { this.x = newx; this.y = newy; } point.move(300,400); (= ) move this (= ) 11

(1) JavaScript 12

(2) function Point(x, y) { this.x = x; this.y = y; this.move = function(newx, newy) { this.x = newx; this.y = newy; }; } var p = new Point(3, 4); move Point.prototype.move = function(newx, newy) { this.x = newx; this.y = newy; }; 1 13

14

DOM 15

( ) ( ) 16

<head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <script type="text/javascript"> document.onmousemove = mousemove; function mousemove(evnt) { var x = parseint(evnt.clientx); var y = parseint(evnt.clienty); var screen = document.getelementbyid("screen"); screen.innerhtml="x: "+x+" y: "+y; } </script> </head> <body> <div id="screen"></div> </body> 17

DOM var screen = document.getelementbyid( screen ); var scrsty = screen.style; scrsty.position= absolute ; scrsty.top=100 + px ; sctsty.left=200+ px ; 18

var amount = 0; function changeamount(x) { document.getelementbyid("inputscreen").value=x; amount = x; } </script> </head> <body onload="changeamount(0)"> <form> <input type="text" width="20" id="inputscreen"/><br/> <input type="button" value="7" onclick="changeamount(10*amount+7)"/> <input type="button" value="8" onclick="changeamount(10*amount+8)"/> <input type="button" value="9" onclick="changeamount(10*amount+9)"/> <br/> <input type="button" value="4" onclick="changeamount(10*amount+4)"/> <input type="button" value="5" onclick="changeamount(10*amount+5)"/> <input type="button" value="6" onclick="changeamount(10*amount+6)"/> <br/> <input type="button" value="1" onclick="changeamount(10*amount+1)"/> <input type="button" value="2" onclick="changeamount(10*amount+2)"/> <input type="button" value="3" onclick="changeamount(10*amount+3)"/> <br/> <input type="button" value="0" onclick="changeamount(10*amount)"/> <input type="button" value="c" onclick="changeamount(0)"/> <input type="button" value="d" onclick="changeamount(math.floor(amount/10+0.01))"/> </form> 19

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> </head> <body> <script type="text/javascript"> </script> </body> </html> 20