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

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

untitled


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

_IMv2.key

第7回 Javascript入門

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

SmartBrowser_document_build30_update.pptx

第7回 Javascript入門

54 5 PHP Web hellow.php 1:<?php 2: echo "Hellow, PHP!Y=n"; 3:?> echo PHP C 2: printf("hellow, PHP!Y=n"); PHP (php) $ php hellow.php Hellow, PHP! 5.1.2

ch31.dvi

2003年度 情報処理概論

* この 確認問題解答 / 演習問題解答 は, 書籍 HTML 演習 HTML5 版 ( 発行 : 株式会社 SCC) の ダウンロード用 [ 別冊 ] として, 当該書籍の読者に限定して提供しています - 2 -

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

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

pdf

JavaScript の使い方

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

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

2009 Web B012-1

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

01.ai

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

CodeIgniter Con 2011, Tokyo Japan, February

PowerPoint Presentation

橡点検記録(集約).PDF

hands_on_4.PDF

II 2 p.2 2 GET POST form action URL Aisatsu 2.1 Servlet GET GET : Query String QueryStringTest.java 1 import java.io.ioexception; 2 import java.io.pri

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

vuejs_meetup.key

5-5_arai_JPNICSecSemi_XssCsrf_CM_ PDF

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

( 前回 ) 提出課題 課題 1( 提出課題 ): データベースからデータを読み込み, そのデータを表示する Web ページ作成してみましょう user テーブルから書籍のデータを一覧表示する. 手順 1:PHP のファイルを user_list.php という名前で作業フォルダに作成する. プログ

Lotus Domino XML活用の基礎!

平和教育の目標と主題(案)

Web2.0 REST API + XSLT Amazon hon.jp API XML Consortium XML ( ) REST(GET)API hon.jp Amazon.co.jp Google Map Exif to RDF(kanzaki.com) REST +

intra-mart マスカット連携ガイド

java_servlet2_見本

untitled

第7回 Javascript入門

PHP と Postgresql を用いた 図書館管理システムの構築 裘彬濱 Qiu Binbin 南山大学 情報理工学部

STARTプログラム.indd

6 2 1

2019年度 Webシステムプログラミングa


JavaScript演習

経営論集2011_07_小松先生.indd

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

Transcription:

10 ( SVG 10 ( Ajax Ajax I(SVG) 2017/6/27

10 ( Ajax

10 ( Ajax 100 10

HTML 1<!DOCTYPE html> 2<html> 3 <head> 4 <meta charset="utf-8"/> 5 <script type="text/ecmascript" src="make-svg-elm.js"></script> 6 <script type="text/ecmascript" src="countprimes-ajax.js"></script> 7 <style type="text/css"> 8 td { text-align:right;} 9 </style> 10 <title> </title> 11 </head> 12 <body> 13 <h1 class="head"> </h1> 10 ( Ajax 14 <div> 15 <form name="test" method="put" action="javascript:getdata()"> 16 <div><input type="radio" name="ajax-mode" value="true"> 17 <input type="radio" name="ajax-mode" value="false"> </div> 18 <div><input type="submit" value=" "/></div> 19 </form> 20 </div> 21 <div> 22 <table></table> 23 </div> 24 </body> 25 </html>

HTML ( ) 10 ( 5 HTML Ajax 6 Ajax 7 9 table td 16 17 name ajax-mode 18 22 table ( )

JavaScript (1) 1window.onload = function(){ 2 window.test["ajax-mode"].value = "true"; 3} 4function createxmlhttpreq( func ) { 5 let xmlhttpobj = new XMLHttpRequest(); 6 if(xmlhttpobj) xmlhttpobj.onreadystatechange = func; 7 return xmlhttpobj; 8} 10 ( Ajax 1 3 form name Test form window.test window.text["ajax-mode"].value 4 Ajax ( )

JavaScript ( Ajax getdata 9function getdata() { 10 let table = document.getelementsbytagname("table")[0]; 11 let P = table.parentnode; 12 P.removeChild(table); 13 table = MKHTMLElm(P, "table",{}, {}); 14 let request = 0, start = new Date(); 10 ( Ajax 10 table 11 Ajax getdata 10 table DOM 13 table (table ) 14 request start (Processing mils )

JavaScript (3) 10 ( 15 for(let i=0; i<10; i++) { 16 let httpobj = createxmlhttpreq(function(){ 17 if(httpobj.readystate == 4 && httpobj.status == 200) { 18 let tr = MKHTMLElm(table,"tr",{}, {}); 19 MKHTMLElm(tr, "td", {}, {}). 20 appendchild(document.createtextnode(i*100000+1)); 21 MKHTMLElm(tr, "td", {}, {}). 22 appendchild(document.createtextnode(httpobj.responsetext)); 23 request--; 24 console.log(httpobj.responsetext); 25 console.log(new Date()-start); 26 if(request <= 0) console.log("done"); 27 } 28 }); 29 if(httpobj) { 30 request++; 31 httpobj.open("get",./countprimes.php?n=${i*100000+1}, 32 window.test["ajax-mode"].value == "true"); 33 httpobj.send(null); 34 } 35 } 36} Ajax

JavaScript ( ) 10 ( 15 10 10 17 2 Ajax 18 28 19 20 21 22 td 23 24 26 0 29 35 Ajax 31 32

PHP (1) 10 ( 1<?php 2function isprime($n, &$Primes, $No) { 3 for($j=0;$j<$no;$j++) { 4 $p = $Primes[$j]; 5 if($n % $p == 0) return false; 6 if($n < $p*$p+$p) break; 7 } 8 return true; 9} Ajax & (5 )

PHP ( 10$start = (array_key_exists( N, $_GET))?$_GET[ N ]:$argv[1]; 11$step = 10*10000; 12$limit = 10000; 13$primes = [2]; 14for($i=3;$i<$limit; $i+= { 15 if(isprime($i, $primes, count($primes))) array_push($primes, $i); 16} 10 ( Ajax $argv $argv[0] 2 array_key_exists() $_GET 11 12 13 14 16 array_push() (2 ) (1 )

PHP ( 10 ( 17$c = 0; 18if($start < $limit ) { 19 $c = count($primes); 20 $start = $limit; 21} 22$start = $start - $start % 2 + 1; 23$pNo = count($primes); 24$L = ($start < $step)?$step: ($start + $step); 25for($i=$start;$i<$L; $i+= { 26 if(isprime($i, $primes, $pno)) $c++; 27} 28print $c; 29?> Ajax

PHP ( 10 ( 17 Ajax 18 21 ( ) 22 23 24 25 27 28

10 ( Ajax