Console - Reading Assignment

Nice answers, @Supremedonut :ok_hand:

Just to extend Q4…

…and then by writing JavaScript code (directly in the console) which accesses and manipulates the page’s Document Object Model (DOM).

1 Like
  1. What is the console used for?
    The Console can be used to log information as part of the JavaScript development process, as well as allow you to interact with a web page by carrying out JavaScript expressions within the page’s context. Essentially, the Console provides you with the ability to write, manage, and monitor JavaScript on demand.

  2. How do you open the Console in Google Chrome?
    the menu -> More Tools -> Developer Tools -> console
    F12 key

  3. What does console.log function do?
    In the console, it can check variables and expression value

  4. How can you change the contents of an HTML page through the console?
    In elements, change element’s context, document function in console

1 Like

humm, I am still trying to grasp this with something I know. How about this analogy.

HTML documents are mere ideas on paper, essentially a cartoon with captions: Web 1.0, you are reading a book.

DOM is the animation of the cartoons…spirit is breathed into them that gives them life: Web 2.0. This would be the dream state, you’ve read a book but the darn thing goes off script in the dream state.

Web 3.0 is the dream made flesh? 3-d physical AI?

1 Like
  1. What is the console used for?

The definition in the article is that the Console ā€œprovides you with the ability to write, manage, and monitor JavaScript on demand.ā€ I am not a developer, but my noobie impression is that the console is basically just a test environment where you can monitor your JavaScript development in the context of a page.

  1. How do you open the Console in Google Chrome?

Three dots - more tools - developer tools - console tab

  1. What does console.log function do?

Allows you to see outputs within the console (as opposed alert pop ups, etc)

  1. How can you change the contents of an HTML page through the console?

My impression is you can’t - seems you need to save any code entered into the console and apply it in your main source code, am I guessing there is more to it than that.

1 Like
  1. It’s used to write, manage and monitor javascript instantly.
  2. You can open console in google chrome by clicking 3 dots in top right corner of browser, click more tools, developer tools, console.
  3. The console.log function outputs words, preforms math, and works on multiple lines of variables.
  4. You can change the contents of an HTML page through the console by loading html file into browser then opening up console to use javascript to modify it.
1 Like

Yes, Command + Option + J will be with a Mac OS.

1 Like
  • What is the console used for? The Console provides you with the ability to write, manage, and monitor JavaScript on demand.

  • How do you open the Console in Google Chrome? Navigate to the menu at the top-right of your browser window signified by three vertical dots in a row. From there, you can select More Tools then Developer Tools.

  • What does console.log function do? Rather than have pop-up alerts that we need to continue to click out of, we can work with JavaScript by logging it to the Console with console.log, additionally the JavaScript Console provides you with a space to try out JavaScript code in real time by letting you use an environment similar to a terminal shell interface.

  • How can you change the contents of an HTML page through the console? Using JavaScript commands you can edit the HTML.

1 Like

What is the console used for?
The console allows us to interact with a web page by carrying out JavaScript expressions within the page’s context

How do you open the Console in Google Chrome?

Browser Menu
More Tools
Console
or CTRL + SHIFT + J on Linux/PC and COMMAND + OPTION + J on Mac

What does console.log function do?
Allows us to log information directly in the console

How can you change the contents of an HTML page through the console?
open up the Console and begin working with JavaScript to modify the page

1 Like

Personally, I would see the DOM itself as still Web 1.0, because it’s still the static HTML, but in object form — now ready and waiting for us to plug in JavaScript. It’s JavaScript working via the DOM that breathes spirit into our cartoons with captions and gives us our dynamic Web 2.0. I guess you could say that the DOM is HTML getting itself dressed up and ready to be whisked off its feet by JavaScript and into the world of Web 2.0.

Now we’re bordering on me having to split this off into a new topic — Philosophy for Blockchain Programmers :wink:

My understanding of Web 3.0 is that it is more a term used for our now dynamic Web 2.0 pages at the frontend being able to interact with decentralised smart contracts deployed on a blockchain (at the backend) i.e. dapps — the data is now coming from and being sent to a decentralised blockchain rather than a centrally managed server.

1 Like

1 - What is the console used for?

The Console provides you with the ability to write, manage, and monitor JavaScript on demand.

2 - How do you open the Console in Google Chrome?

To open the JavaScript Console in Chrome, you can navigate to the menu at the top-right of your browser window signified by three vertical dots in a row. From there, you can select More Tools then Developer Tools.
This will open a panel where you can click on Console along the top menu bar to bring up the JavaScript Console.

3 - What does console.log function do?

console.log allows one to print out JavaScript content within the Console, without having to deal with pop-up alerts that needs to be continuously interacted with to close.

4 - How can you change the contents of an HTML page through the console?

The visible content of a page is within the body tag == document.body.innerHTML = …

The body node is not the actual top of the literal HTML tree. Instead, the page content tree starts with a node
called the document. The document node has a child called html. The html node has the node called body.
node.

1 Like

Maybe a better topic for the pub, that is before social distancing rubbish. Here’s a british twist to it quoting ā€˜Sting’ of the Police from the 1981 Album Ghost in the Machineā€¦ā€˜we are spirits in the material world’…lol, cheers mate (I’m 1/2 british, born in Bristol)

1 Like

yes, best for pub nite chat referencing Sting from the Police, 1981 album ā€˜The Ghost in the Machine’

Spirits in the Material World

There is no political solution
To our troubled evolution
Have no faith in constitution
There is no bloody revolution

We are spirits in the material world
Are spirits in the material world
Are spirits in the material world
Are spirits in the material world

Our so-called leaders speak
With words they try to jail you
They subjugate the meek
But it’s the rhetoric of failure

We are spirits in the material world
Are spirits in the material world
Are spirits in the material world
Are spirits in the material world

Where does the answer lie?
Living from day to day
If it’s something we can’t buy
There must be another way {insert boolean logic, blockchain}

We are spirits in the material world
Are spirits in the material world
Are spirits in the material world
Are spirits in the material world
Are spirits in the material world
Are spirits in the material world

1 Like
  1. What is the console used for?
    To provide the ability to write, manage and monitor JavaScript on demand.

  2. How do you open the Console in Google Chrome?
    right side 3 dots, click it, select ā€œmore toolsā€, development tools, or ctrl+Alt+J

  3. What does console.log function do?
    The Console.log() does print any variable or text that is between the parenthesis.

  4. How can you change the contents of an HTML page through the console?
    Writing JS on the console, the results will be shown on run time.

1 Like

The console lets you have a way of interacting with the javascript on a web page. It’s helpful for logging output and debugging code.

Open the console via the main browser menu > More tools > Developer Tools, or just F12, then click on the Console tab if not already open.

Console.log function is like a wrapper that returns the value of what it’s passed, so a number, string, text, HTML will be echoed in the browser console area. Javascript output will be shown in console.

HTML can be modified via the console. Changes made via the console are temporary as the saved file is not modified. The console allows us a way to experiment with javascript.

1 Like
  1. The console provides web developers with the ability to write, manage, and monitor JavaScript on demand (it allows them debug in
  2. To open the console in Google Chrome, go to Menu>More Tools>Developer Tools or Ctrl+Shift+J (on Windows)
  3. The console.log function allows you to check the output of a JavaScript command - it provides you with the space to try out JavaScript code in real time by letting you use an environment similar to a terminal shell interface
  4. To change the contents of an HTML page through the console, you can write a script that creates HTML elements. This allows the developer to simulate temporary modifications to HTML pages…it does not save changes to the HTML document
1 Like
  1. The Console is similar to a shell interface. The Console can be used to log information as part of the JavaScript development process, as well as allow you to interact with a web page by carrying out JavaScript expressions within the page’s context. Essentially, the Console provides you with the ability to write, manage, and monitor JavaScript on demand.
  2. Use the keyboard shortcut CTRL + SHIFT + J on Linux or Windows, or COMMAND + OPTION + J on macOS, which will bring focus immediately to the Console.
    Otherwise:
    Navigate to the menu at the top-right of your browser window signified by three vertical dots in a row. From there select More Tools then Developer Tools. This will open a panel where click on Console along the top menu bar to bring up the JavaScript Console if it is not highlighted already:
  3. The JavaScript Console provides you with a space to try out JavaScript code in real time by letting you use an environment similar to a terminal shell interface.
  4. Use the ā€œdocumentā€ command /or use the CTR+I (inspector) and change the code directly there
1 Like
  1. The console provides you with the ability to write, manage and monitor javascript on demand.

  2. Ctrl + Shift + J

  3. Console.log function is used to print any kind of variables defined before in it or to just print any message that needs to be displayed to the user.

  4. You are not changing the HTML document when you do things on the console.

1 Like
  1. What is the console used for?
    The console gives you the ability to interact with javascript on demand.
  2. How do you open the Console in Google Chrome?
    Menu -> More Tools -> Developer Tools -> Console or Ctrl+Shift+J
  3. What does console.log function do?
    The console.log function gives you the output of a code in real time by using an environment that is similar to a terminal shell interface.
  4. How can you change the contents of an HTML page through the console?
    You can’t change the actual HTML through the console, but you can use the console to experiment with javascript. The changes you make in the console, won’t be saved.
1 Like

1. What is the console used for?

The Console allows interaction with a web page through JavaScript expressions and logs info in the development process. It allows to write, manage and monitor JavaScript.

2. How do you open the Console in Google Chrome?

Click the three vertical lines in the top right corner, then click "More Tools" and "Developer Tools".

3. What does console.log function do?

It logs JavaScript to the console instead of putting out pop-ups.

4. How can you change the contents of an HTML page through the console?

Through the DOM Tree and the Elements Panel (Chrome) or Inspector Panel (Firefox).
1 Like

Good answers, @angieww :ok_hand:

By the way what keyboard are you using?

Normally, it’s Ctrl + Shift + J (or I)…

1 Like