JavaScript Ajax Google Web Toolkit



Similar documents
JavaScript: Client-Side Scripting. Chapter 6

JavaScript Basics & HTML DOM. Sang Shin Java Technology Architect Sun Microsystems, Inc. sang.shin@sun.com

Web Programming Step by Step

JavaScript. JavaScript: fundamentals, concepts, object model. Document Object Model. The Web Page. The window object (1/2) The document object

Phil Ballard Michael Moncur. Sams Teach Yourself. JavaScript. Fifth Edition. Hours. 800 East 96th Street, Indianapolis, Indiana, USA


What is AJAX? Ajax. Traditional Client-Server Interaction. What is Ajax? (cont.) Ajax Client-Server Interaction. What is Ajax? (cont.

Client-side Web Engineering From HTML to AJAX

Client-side programming with JavaScript. Laura Farinetti Dipartimento di Automatica e Informatica Politecnico di Torino laura.farinetti@polito.

Course Information Course Number: IWT 1229 Course Name: Web Development and Design Foundation

CIS 467/602-01: Data Visualization

Advanced Web Development SCOPE OF WEB DEVELOPMENT INDUSTRY

JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK

Entrust Managed Services PKI Administrator s Quick Start Guide

Introduction to Selenium Using Java Language

Integration Guide. Integrating Extole with Salesforce. Overview. Use Cases

JAVASCRIPT AND COOKIES

Attacks on Clients: Dynamic Content & XSS

Symfony 2 Tutorial. Model. Neues Bundle erstellen: php app/console generate:bundle --namespace=blogger/blogbundle

What about MongoDB? can req.body.input 0; var date = new Date(); do {curdate = new Date();} while(curdate-date<10000)

Web Development using PHP (WD_PHP) Duration 1.5 months

Next Generation Clickjacking

The Web Web page Links 16-3

Cross-Site Scripting Prevention with Dynamic Data Tainting and Static Analysis

Debugging JavaScript and CSS Using Firebug. Harman Goei CSCI 571 1/27/13

GLEN RIDGE PUBLIC SCHOOLS MATHEMATICS MISSION STATEMENT AND GOALS

A visual DSL toolkit in Lua

SUBJECT CODE : 4074 PERIODS/WEEK : 4 PERIODS/ SEMESTER : 72 CREDIT : 4 TIME SCHEDULE UNIT TOPIC PERIODS 1. INTERNET FUNDAMENTALS & HTML Test 1

IE Class Web Design Curriculum

JSClassFinder: A Tool to Detect Class-like Structures in JavaScript

Entrust Managed Services PKI Administrator Guide

Certified PHP/MySQL Web Developer Course

Modern Web Development From Angle Brackets to Web Sockets

Progressive Enhancement With GQuery and GWT. Ray Cromwell

This matches a date in the MM/DD/YYYY format in the years The date must include leading zeros.

Designing Web Sites for Phone Browsers

HP LoadRunner. Software Version: Ajax TruClient Tips & Tricks

HAML und SASS. (und COMPASS) markup haiku vs. syntactically awesome stylesheets. Tobias Adam, Jan Krutisch mindmatters GmbH & Co.

80+ Things Every Marketer Needs to Know About Their Website

Unlocking the Java EE Platform with HTML 5

Introduction to web development and JavaScript

Web Development CSE2WD Final Examination June (a) Which organisation is primarily responsible for HTML, CSS and DOM standards?

Multimedia im Netz Online Multimedia Winter semester 2015/16. Tutorial 03 Major Subject

Security Model for the Client-Side Web Application Environments

WebSphere Business Monitor V7.0 Script adapter lab

Accessibility Guidelines Bell.ca Special Needs. Cesart April 2006

JavaScript Patterns. Stoyan Stefanov. O'REILLY' Beijing Cambridge Farnham Koln Sebastopol Tokyo

Web Testing. Main Concepts of Web Testing. Software Quality Assurance Telerik Software Academy

Script Handbook for Interactive Scientific Website Building

WIRIS quizzes web services Getting started with PHP and Java

Semantics and Security Issues in JavaScript

Preface. Motivation for this Book

Part I: The Road to Single Page Application Development... 1

Overview. In the beginning. Issues with Client Side Scripting What is JavaScript? Syntax and the Document Object Model Moving forward with JavaScript

OASIS Bill Pay Service

Mobile Performance: for excellent User Experience

NetFlow for SouthWare NetLink

Web Programming Step by Step

Mandan Public Schools. Information Technology Curriculum

ACCESSING THE PROGRESS OPENEDGE APPSERVER FROM PROGRESS ROLLBASE USING JSDO CODE

How To Test Your Web Site On Wapt On A Pc Or Mac Or Mac (Or Mac) On A Mac Or Ipad Or Ipa (Or Ipa) On Pc Or Ipam (Or Pc Or Pc) On An Ip

c. Write a JavaScript statement to print out as an alert box the value of the third Radio button (whether or not selected) in the second form.

Intro to Web Programming. using PHP, HTTP, CSS, and Javascript Layton Smith CSE 4000

Credits: Some of the slides are based on material adapted from

Interactive, dynamic Scalable Vector Graphics

10CS73:Web Programming

Web Development Recipes

HOW TO INTEGRATE APPLICATIONS RELEASE 11i WITH CUSTOM APPLICATIONS

Pizza SEO: Effective Web. Effective Web Audit. Effective Web Audit. Copyright Pizza SEO Ltd.

USER MANUAL Online Faxing Anywhere, Anytime Paperless Secure Faxing Anytime, Anywhere

Cross-Site Scripting Prevention with Dynamic Data Tainting and Static Analysis

RARITAN VALLEY COMMUNITY COLLEGE ACADEMIC COURSE OUTLINE. CISY 105 Foundations of Computer Science

EMC ViPR Controller. Version 2.4. User Interface Virtual Data Center Configuration Guide REV 01 DRAFT

1. User Guide API overview addon - xml Definition addon.background addon.background.script

Chapter 10. Document Object Model and Dynamic HTML

Web development... the server side (of the force)

«W3Schools Home Next Chapter» JavaScript is THE scripting language of the Web.

ECMAScript 3 rd Edition Compact Profile

Adding Panoramas to Google Maps Using Ajax

core 2 JavaScript Adding Dynamic Content to Web Pages

WWW. World Wide Web Aka The Internet. dr. C. P. J. Koymans. Informatics Institute Universiteit van Amsterdam. November 30, 2007

Facebook Twitter YouTube Google Plus Website

Load testing with. WAPT Cloud. Quick Start Guide

MASTERTAG DEVELOPER GUIDE

XML Copyright InduSoft Systems LLC 2006

Techniques and Tools for Rich Internet Applications Testing

Lab 7 Keyboard Event Handling Mouse Event Handling

English. Asema.com Portlets Programmers' Manual

Transcription:

Client Tier Web Tier Business Logic Tier EIS Tier

JavaScript Warum?

e@mail == E-Mail Adresse?

ECMAJavaLiveScript

ECMAJavaLiveScript

ECMAJavaLiveScript

ECMAJavaLiveScript

ECMAJavaLiveScript

[tschawaskript] : ECMAScript

97 % JavaScript akiviert 99 % JavaScript 1.5

dynamisch typisiert, klassenlos, objektbasiert

dynamisch typisiert, klassenlos, objektbasiert var a; a = 1; a = eins ;

dynamisch typisiert, klassenlos, objektbasiert

dynamisch typisiert, klassenlos, objektbasiert prototypbasiert

Objekt wert1 wert2 wert3 funktion1 funktion2 funktion3 true 3 wert2 function eins() { } function zwei() { } function drei() { }

function Mensch(name) { this.name = name; this.sagname = function () { alert( Ich bin + this.name); } } var hans = new Mensch( Hans ); hans.sagname(); //== hans[ sagname ](); //Output: Ich bin Hans

hans name sagname Hans function sagname() { alert( Ich bin + this.name); }

function Mensch(name) { this.name = name; this.sagname = function () { alert( Ich bin + this.name); } } var hans = new Mensch( Hans ); hans.sagname(); alert(hans.constructor); //Output: function Mensch(name) {

hans

hans prototype Mensch

hans prototype Mensch Mensch.prototype (Object) constructor proto tostring

hans name sagname Hans function sagname() { alert( Ich bin + this.name); } prototype Mensch Mensch.prototype (Object) constructor proto tostring

hans name sagname proto Hans function sagname() { alert( Ich bin + this.name); } prototype Mensch Mensch.prototype (Object) constructor proto tostring

function Mensch(name) { this.name = name; this.sagname = function () { alert( Ich bin + this.name); } } function Mann(name) { Mensch.call(this,name); this.gender = maennlich ; } Mann.prototype = new Mensch( noname );

Array Date Math navigator

Array Date Math navigator var a = new Array(1,2,3); alert(a.length); //Output: 3

Array Date Math navigator var d = new Date(); alert(d.getdate() +. + d.getmonth() +. + d.getfullyear()); //Output: 30.4.2009

Array Date Math navigator alert(math.pi); alert(math.random()); //Output: 3.141592653589793 // 0.8760295817628503

Array Date Math navigator alert(navigator.cookieenabled); alert(navigator.appname); //Output: true // Netscape

window window.alert( Hallo Welt! ); window.resizeto(800,600);

window document event history location window.location.href = http://web.de ; window.history.back();

window document event history location anchors applets forms images links elements document.title = neuer Titel ; document.images[0].src = neuesbild.jpg ;

document event history location anchors applets forms images links elements

document event history location anchors applets forms images links elements h1 meta p ul span table title

Document Object Model

<body> <h1>table of Content</h1> <ul> <li>javascript</li> <li>ajax</li> </ul> </body> body h1 ul Table of Content li li JavaScript Ajax

getelementbyid() getelementsbyname() document getelementsbytagname()

node attributes firstchild nextsibling nodevalue appendchild() removechild() getattributenode() setattributenode()

<body> <h1 id= toc >Table of Content</h1> <ul id= toclist > <li>javascript</li> <li>ajax</li> </ul> </body> var toc = document.getelementbyid( toc ); var tocvalue = toc.firstchild.nodevalue; alert(tocvalue); //Output: Table Of Content

<body> <h1 id= toc >Table of Content</h1> <ul id= toclist > <li>javascript</li> <li>ajax</li> </ul> </body> var list=document.getelementbyid( toclist ); var GWT = document.createnode( li ); var GWTText = document.createtextnode( GWT ); GWT.appendChild(GWTText); list.appendchild(gwt);

Benutzereingabe Event Eventhandler? Event verarbeiten

on blur change click dbclick focus keypress load mouseover

<body> <h1 onmouseover= mover() > Table of Content </h1> <ul id= toclist > <li>javascript</li> <li>ajax</li> </ul> </body> function mover (e) { this.style.color = #FF0000 ; }

<body> <h1 id= toc >Table of Content</h1> <ul id= toclist > <li>javascript</li> <li>ajax</li> </ul> </body> var toc = document.getelementbyid( toc ); toc.onmouseover = mover; function mover (e) { this.style.color = #FF0000 ; }

JavaScript

JavaScript

JavaScript Cookies

JavaScript Cookies document.cookie = var1=wert1 ; var inhalt = document.cookie;