Scribd
Upload
3 views

JavaScript

Uploaded by

Anthonia Vital
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
3 views

JavaScript

Uploaded by

Anthonia Vital
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

JavaScript – Book

 Introduction: All modern we browsers, Node.js as well as almost every other JavaScript
environment support writing message to a console using a suite of logging methods.
The most common of these methods is console.log (). In a browser environment, the
console.log () function is predominantly used for debugging purposes.
 Getting Started: Console.log (“Hello, world!”);
 This is because console.log () has no explicit return value.
 Logging variables: Console.log () can be used to log variables of any kind; not only
strings. Just pass in the variable that you want to be displayed in the console, for
example: var foo = “bar”; console.log(foo);
 If want more to log two or more values, simply separate them with commas.
 Var thisVar = ‘first value’; var thatVar = ‘second value’; console.log (“thisVar:”, thisVar,
“and thatVar:”, thatVar);
 Placeholders: Can use console.log () in combination with placeholders: var greet =
“Hello”, who = “World”; console.log (“%s, %s!”, greet, who);
 Logging objects: Below we see the result of logging an object. This is often useful for
logging JSON responses from API calls. Console.log ( { ‘email’: ‘’, ‘groups’: {}, ‘id’ : 33,
‘ishiddeninui’; false, ‘issiteadmin’: false, ‘loginname’: ‘i:0#.w|virtualdomain\\user2’,
‘principaltype’:1, ‘title’: ‘user2’});
 Logging HTML elements: You have the ability to log any element which exists within
the DOM. In this case we log the body element: console.log(document.body);

Using the DOM API


 DOM stands for document object model. It is an object-oriented representation of
structured documents like XML and HTML. Setting the textContent property of an
element is one way to output text on a web page. For example, consider the following
HTML tag: <p id=”paragraph”></p>.
 To change its textContent property, we can run the following JS:
document.getElementById(“paragraph”).textContent = “Hello, World”;
 This will select the element that with the id paragraph and sets its text content to
“Hello, World”: <p id=”paragraph”>Hello, World</p>.
 You can also use JS to create a new HTML element programmatically.
 JS we crate a new <p> tag with a textContent property of and add it at the end of the
html body: var element = document.createElement(‘p’); element.textContent = “hello,
world”; document.body.appendChild(element); // add the newly create element to
the DOM.
 That order to manipulate elements in the DOM using JS, the JS code must be run after
the relevant element has been created in the document. This can be achieved by
putting the JS <script> tags after all of your other <body. Content. Alternatively, you
can also use an event listener to listen to eg.window’s.on.load.content, adding your
code to that event listener will delay running your code until after the whole on your
page has been loaded. A third way to make sure all your DOM has been loaded is to
wrap the DOM manipulation code with a timeout function of 0 ms. This way, this JS
code is re-queued at the end of the execution queue, which gives the browser a
chance to finish doing some non-JS things that have been waiting to finish before
attending to this new piece of JS.
Using window.alert ( )
The alert method displays a visual alert box on screen. The alert method parameter is
displayed to the user in plain text: window.alert(message);

Because window is the global object, you can call also use the following shorthand:
alert(message);

So what does window.alert( )do? Well, let’s take the following example: alert (‘hello, world’);

The alert method is technically a property of window object, but since all window properties
are automatically global variables, we can use alert as a global variable instead of as a property
of window – meaning you can directly use alert () instead of window.alert( ).

You might also like