...

Web Technologies - JAVASCRIPT

Back to Course

Lesson Description


Lession - #197 Javascript Output


JavaScript can "dispaly" information in different ways:

  • Writing into a HTML component, utilizing innerHTML.
  • Writing into the HTML output utilizing document.write(>
    .
  • Writing into an alert box, utilizing window.alert(>
    .
  • Writing into the browser console, utilizing console.log(>
    .


    innerHTML

    What is internal HTML?

    InnerHTML is a property of the HTML DOM. innerHTML is frequently used to set and alter the contents of a

    component. The DOM means you don't need to change the HTML code each time you need to change a web component. You can utilize the DOM and JavaScript to change how the page shows up in a specific session.



    Let's see an example

    
    
    <!DOCTYPE html>
    <html>>
    <body>
    
    <p>My First Paragraph</p>
    
    <p id="demo"></p>
    
    <script>
    document.getElementById("demo">
    .innerHTML = 5 + 6; </script> </body> </html>

    Output:


    Try it here

    document.write(>

    The Document.write(>
    method write a line of text to a document stream opened by document.
    
    
    <!DOCTYPE html>
    <html>
    <body>
    
    <p>My first paragraph.</p>
    
    <script>
    document.write(5 + 6>
    ; </script> </body> </html>

    Output:


    Try it here

    write.alert

    window. alert(>
    instructs the browser to display a dialog with a optional message, and to wait until the user dismisses the dialog. Under certain conditions — for instance, when the user switches tabs — the browser may not really show an dialog, or may not wait for the user will dismiss the dialog.

    You can skip the window keyword
    
    
    <!DOCTYPE html>
    <html>
    <body>
    
    <p>Window alert</p>
    
    <script>
    window.alert("Hello world!">
    ; </script> </body> </html>

    Output:


    Try it here

    console.log

    log(>
    is a function in JavaScript which is utilized to print any sort of factors characterized before in it or to simply print any message that should be shown to the user.
    Syntax: console. log(A>
    ;
    Parameters: It acknowledges a boundary which can be a array, an object or any message.
    
    
    <!DOCTYPE html>
    <html>
    <body>
    
    <h2>Activate Debugging</h2>
    
    <p>F12 on your keyboard will activate debugging.</p>
    <p>Then select "Console" in the debugger menu.</p>
    <p>Then click Run again.</p>
    
    <script>
    console.log("welcome to techedhub">
    ; </script> </body> </html>

    Output:


    Try it here