Scribd Logo
Unggah

Selamat datang di Scribd!

  • HTML and Javascript: John Ryan B. Lorca Instructor I

    Diunggah oleh

    Eric Nilo
    26 tayangan14 halaman
    This document discusses using HTML and JavaScript together to create interactive web pages. It covers events in JavaScript that trigger functions, and how to define both void and returning functions within <script> tags. It provides examples of functions that add two numbers, including ones that alert the sum and ones that return the sum to an HTML element.

    Deskripsi Asli:

    Judul Asli

    5-HTML and JavaScript

    Hak Cipta

    © Attribution Non-Commercial (BY-NC)

    Format Tersedia

    PPTX, PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini
    This document discusses using HTML and JavaScript together to create interactive web pages. It covers events in JavaScript that trigger functions, and how to define both void and returning functions within <script> tags. It provides examples of functions that add two numbers, including ones that alert the sum and ones that return the sum to an HTML element.

    Hak Cipta:

    Attribution Non-Commercial (BY-NC)
    Unduh sebagai PPTX, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    26 tayangan14 halaman

    HTML and Javascript: John Ryan B. Lorca Instructor I

    Diunggah oleh

    Eric Nilo
    This document discusses using HTML and JavaScript together to create interactive web pages. It covers events in JavaScript that trigger functions, and how to define both void and returning functions within <script> tags. It provides examples of functions that add two numbers, including ones that alert the sum and ones that return the sum to an HTML element.

    Hak Cipta:

    Attribution Non-Commercial (BY-NC)
    Unduh sebagai PPTX, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    dari 14

    HTML and JavaScript

    John Ryan B. Lorca Instructor I

    HTML and JavaScript


    Web pages must be interactive to be attractive to Internet surfers JavaScript and HTML are good partners in providing client-side functions that, in more advanced applications, are deemed necessary be for server-side executions

    Events in JavaScript
    Events are moments of interaction between the user and the computer, or internal Windows activity
    Keypress Mouse-click

    Note: We need to catch events to perform tasks or functions


    3

    Functions in JavScript
    may be pre-defined or user-defined a separate collection of instructions for the computer to follow that is called after an event is triggered or when the user called it on purpose located within the <script> tag in the <head>

    Functions in JavaScript: Pre-defined


    Void Function (doesnt return a value)
    function ([argument]) { <statements>; }

    Functions that return a value


    function ([argument]) { <statements>; return <value>; }

    Note: Arguments are optional (as required)


    5

    Void Functions
    <script type=text/javascript> function getSum(x, y) { var sum = 0; sum = x + y; alert(SUM: + sum); } </script>
    6

    Functions that Return a Value


    <script type=text/javascript> function getSum(x, y) { var sum = 0; sum = x + y; return sum; } </script>
    7

    HTML and JavaScript: Sample Problem


    Develop a web application that accepts two integers and computes the sum

    Solution #1: Addition


    <html> <head><title>Addition</title> <script type=text/javascript> function getSum() { var x = document.getElementById(txtNUM1).value; var y = document.getElementById(txtNUM2).value; var sum = x + y; alert(SUM: + sum); } </script> </head>

    Solution #1: Addition (ctd)


    <body> <input type=text id=txtNUM1 /> + <input type=text id=txtNUM2 /> <input type=button value=ADD onclick=getSum() /> </body> </html>

    10

    Solution #2: Addition


    <html> <head><title>Addition</title> <script type=text/javascript> function getSum(x, y) { var sum = x + y; alert(SUM: + sum); } </script> </head>
    11

    Solution #2: Addition (ctd)


    <body> <input type=text id=txtNUM1 /> + <input type=text id=txtNUM2 /> <input type=button value=ADD onclick=getSum(document.getElementById(txtNUM1).value , document.getElementById(txtNUM1).value) /> </body> </html>

    12

    Solution #3: Addition


    <html> <head><title>Addition</title> <script type=text/javascript> function getSum(x, y, area) { var sum = x + y; area.innerHTML = SUM: + sum; } </script> </head>
    13

    Solution #3: Addition (ctd)


    <body> <input type=text id=txtNUM1 /> + <input type=text id=txtNUM2 /> <input type=button value=ADD onclick=getSum(document.getElementById(txtNUM1).value , document.getElementById(txtNUM1).value, document.getElementById(outputArea)) /> <span id=outputArea>&nbsp;</span> </body> </html>

    14

    Anda mungkin juga menyukai