Scribd Logo
Upload

Welcome to Scribd!

  • Web Design Class 6

    Uploaded by

    M Yacine
    17 views80 pages
    The document is a lecture on JavaScript presented by Dr. Fouad Kharroubi. It introduces JavaScript and provides examples of how JavaScript can be used to change HTML content, style, and attributes. It also covers JavaScript functions, objects, scope, and events. Key points include how JavaScript code can be embedded in HTML documents, how to define and call functions, and how JavaScript can respond to user interactions and HTML events.

    Original Description:

    Original Title

    Web_Design_Class_6

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document is a lecture on JavaScript presented by Dr. Fouad Kharroubi. It introduces JavaScript and provides examples of how JavaScript can be used to change HTML content, style, and attributes. It also covers JavaScript functions, objects, scope, and events. Key points include how JavaScript code can be embedded in HTML documents, how to define and call functions, and how JavaScript can respond to user interactions and HTML events.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    17 views80 pages

    Web Design Class 6

    Uploaded by

    M Yacine
    The document is a lecture on JavaScript presented by Dr. Fouad Kharroubi. It introduces JavaScript and provides examples of how JavaScript can be used to change HTML content, style, and attributes. It also covers JavaScript functions, objects, scope, and events. Key points include how JavaScript code can be embedded in HTML documents, how to define and call functions, and how JavaScript can respond to user interactions and HTML events.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 80

    Royaume du Maroc

    Ministère de l’Education Nationale, de la Formation Professionnelle


    de l'Enseignement Supérieur et de la Recherche Scientifique

    Université Chouaib Doukkali,


    Ecole Nationale des Sciences Appliquées d’El Jadida (ENSA)
    2017-2018

    An Introduction To Web Design

    Semester 2
    2ITE/Grade 1/Class 6

    Dr.-Ing. Fouad KHARROUBI


    JavaScript

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 2


    JavaScript (wiki)

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 3
    Central South University of Forestry and Technology
    JavaScript (Example)

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 4


    JavaScript (Example)

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 5


    JavaScript (Example) : JavaScript Can Change HTML
    Content

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 6


    JavaScript (Example) : JavaScript Can Change HTML
    Content

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 7


    JavaScript (Example) : JavaScript Can Change HTML
    Content

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 8


    JavaScript (Example) :JavaScript Can Change HTML
    Attributes

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 9


    JavaScript (Example) :JavaScript Can Change HTML
    Attributes

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 10


    JavaScript (Example) :JavaScript Can Change HTML
    Attributes

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 11


    JavaScript (Example) :JavaScript Can Change HTML
    Attributes

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 12


    JavaScript (Example) :JavaScript Can Change HTML Style
    CSS

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 13


    JavaScript (Example) :JavaScript Can Change HTML Style
    CSS

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 14


    JavaScript (Example) :JavaScript Can hide HTML elements

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 15


    JavaScript (Example) :JavaScript Can hide HTML elements

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 16


    JavaScript (Example) :JavaScript Can show HTML elements

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 17


    JavaScript (Example) :JavaScript Can show HTML elements

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 18


    JavaScript : Where to…

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 19


    JavaScript : Where to…

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 20


    JavaScript : in <head> or <body>

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 21
    Central South University of Forestry and Technology
    JavaScript in <head>

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 22


    JavaScript in <head>

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 23


    JavaScript in <body>

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 24
    Central South University of Forestry and Technology
    JavaScript in <body>

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 25


    JavaScript in <body>

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 26


    External JavaScript

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 27
    Central South University of Forestry and Technology
    External JavaScript

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 28


    External JavaScript

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 29


    External JavaScript

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 30


    JavaScript Display Possibilities

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 31


    Using innerHTML

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 32
    Central South University of Forestry and Technology
    Using innerHTML

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 33


    Using document.write()

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 34


    Using document.write()

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 35


    Using document.write()

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 36


    Using document.write()

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 37


    Using document.write()

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 38


    Using Window.alert()

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 39


    Using Window.alert()

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 40


    JavaScript Functions

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 41


    JavaScript Functions

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 42


    JavaScript Functions

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 43


    JavaScript Function Syntax

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 44


    Function return

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 45


    Why Functions?

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 46


    Why Functions?

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 47


    JavaScript Objects

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 48


    JavaScript Objects

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 49
    Central South University of Forestry and Technology
    JavaScript Objects

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 50


    JavaScript Objects

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 51


    JavaScript Objects

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 52


    JavaScript Objects

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 53


    Object Properties

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 54


    Object Methods

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 55


    Object Definition

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 56


    Object Definition

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 57


    Object Definition

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 58


    Object Definition

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 59


    Accessing Object Properties

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 60


    Accessing Object Properties: Example 1

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 61


    Accessing Object Properties: Example 2

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 62


    Accessing Object Methods

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 63


    Accessing Object Methods

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 64


    JavaScript Scope

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 65


    JavaScript Scope
    Scope is the set of variables you have access to

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 66


    Local JavaScript Variables

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 67
    Central South University of Forestry and Technology
    Local JavaScript Variables

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 68


    Global JavaScript Variables

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 69


    Global JavaScript Variables

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 70


    Automatically Global

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 71


    Automatically Global

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 72


    Global Variables in HTML

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 73


    Global Variables in HTML

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 74


    JavaScript Events
    HTML events are "things" that happen to HTML elements.
    When JavaScript is used in HTML pages, JavaScript can "react" on these events.

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 75
    Central South University of Forestry and Technology
    JavaScript Events: Example 1

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 76


    JavaScript Events: Example 2

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 77


    JavaScript Events: Example 2

    Dr-Ing Fouad KHARROUBI


    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 78
    Central South University of Forestry and Technology
    Common HTML Events

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 79


    What Can JavaScript Do?

    03/07/2018 Dr-Ing Fouad KHARROUBI UCD-ENSAJ 80

    You might also like