scripting apis for the web

Post on 12-Sep-2021

5 Views

Category:

Documents

0 Downloads

Preview:

Click to see full reader

TRANSCRIPT

Scripting APIs for the Web

Dean Jackson

AJAXA.J.A.X

Ajax

HTML1

Client Server

HTML2

HTML3

HTML

Client Server

XMLHttpRequest

Web APIs Working Group

XMLHttpRequestWindow

Application

Toolkit

Architecture

Standardise existing behaviour wherever

possible

1

Get implementors involved

2

Open channels of communication

(in both directions)

3

Work quickly

4

XMLHttpRequest

Allows a script to asynchronously fetch data from a remote host.

var req = new XMLHttpRequest();req.open('GET', '/favourite-animals', false);req.send(null);

if (req.status == 200) { // 200 is HTTP OK alert(req.getResponseHeader(’Content-Type’)); alert(req.responseText);}

HTTP/1.1 200 OKDate: Wed, 24 May 2006 11:38:08 GMTServer: Apache/1.3.33 (Darwin) PHP/4.4.1Last-Modified: Wed, 24 May 2006 11:37:40 GMTETag: "13b15b-33-44744584"Accept-Ranges: bytesContent-Length: 51Content-Type: text/plain

koalakangaroowallabyemuplatypusechidnawombat

• return codes

• setting headers

• security model

XMLHttpRequest

http://www.w3.org/TR/XMLHttpRequest

Window

An interface that allows a script to communicate with the browser

context.

• location

• embedded documents

• timer methods

• security considerations

// we don’t need to use document.window as// window is the default ECMAscript context

// create a function to be called in a while

function ping() { alert(”Hello Ediburgh!”);}

// call the ping function in 1000 milliseconds

var timerID = setTimeout(ping, 1000);

Window

http://www.w3.org/TR/Window

DOM Level 3 Events

• added support for namespaced events

• new event types

• deprecating/simplifying some features

• community feedback on whether event groups are needed

DOM Level 3 Events

http://www.w3.org/TR/DOM-Level-3-Events

Remote Events for XML (REX)

http://www.w3.org/TR/REX

Selectors

XPath Selectorsvar imgs = document.evaluate(

"//img",

document,

null,

XPathResult.ANY_TYPE,

null);

CSS Selectors

var imgs =

document.matchAll(“img”);

• DOM Level 3 Core

• Client side storage

• File upload

• Better networking

• Timers

Declarative vs Programmatic

Building a Web Operating System

thanks!!!

dino@w3.org

top related