Skip to content
geeksforgeeks
  • Tutorials
    • Python
    • Java
    • Data Structures & Algorithms
    • ML & Data Science
    • Interview Corner
    • Programming Languages
    • Web Development
    • CS Subjects
    • DevOps And Linux
    • School Learning
    • Practice Coding Problems
  • Courses
    • DSA to Development
    • Get IBM Certification
    • Newly Launched!
      • Master Django Framework
      • Become AWS Certified
    • For Working Professionals
      • Interview 101: DSA & System Design
      • Data Science Training Program
      • JAVA Backend Development (Live)
      • DevOps Engineering (LIVE)
      • Data Structures & Algorithms in Python
    • For Students
      • Placement Preparation Course
      • Data Science (Live)
      • Data Structure & Algorithm-Self Paced (C++/JAVA)
      • Master Competitive Programming (Live)
      • Full Stack Development with React & Node JS (Live)
    • Full Stack Development
    • Data Science Program
    • All Courses
  • HTML Tutorial
  • HTML Exercises
  • HTML Tags
  • HTML Attributes
  • Global Attributes
  • Event Attributes
  • HTML Interview Questions
  • HTML DOM
  • DOM Audio/Video
  • HTML 5
  • HTML Examples
  • Color Picker
  • A to Z Guide
  • HTML Formatter
Open In App

HTML DOM console log() Method

Last Updated : 30 Aug, 2024
Comments
Improve
Suggest changes
Like Article
Like
Report

The console.log() method in HTML is used for writing a message in the console. It indicates an important message during the testing of any program. The message is sent as a parameter to the console.log() method. 

Syntax

console.log( message )

Parameters

Parameter

Description

message

It is mandatory and used to specify the information to be written on the console. 

HTML DOM console log() Method Examples

Example 1: In This example we demonstrates the use of the DOM console.log() method. Clicking the button triggers a function that logs a message to the browser console, allowing developers to view it by pressing F12 or inspecting the page.

html
<!DOCTYPE html> <html>  <head>     <title>DOM console.log() Method</title> </head>  <body>     <h1>GeeksforGeeks</h1>     <h2>         DOM console.log() Method     </h2>     <p>         To view the message in the console         press the F12 key on your keyboard.     </p>     <p>         To view the message, click the button below:     </p>     <br>     <button onclick="log_console()">         View Message     </button>     <script>         function log_console() {             console.log("GeeksforGeeks is a portal for geeks.");         }     </script> </body>  </html> 

Output:

kil

Example 2: In this example, we showcases the DOM console.log() method. Clicking the button triggers a JavaScript function, logging an object containing product information to the console for viewing.

html
<!DOCTYPE html> <html>  <head>     <title>DOM console.log() Method</title> </head>  <body>     <h1>GeeksforGeeks</h1>     <h2>DOM console.log( ) Method</h2>     <p>         To view the message in the console         press the F12 key on your keyboard.     </p>     <p>         To view the message, click the button         below:     </p>     <br />     <button onclick="log_console()">         View Message     </button>     <script>         function log_console() {             let MyElement = {                 Product: "Coca Cola",                 Type: "Beverage",             };             console.log(MyElement);         }     </script> </body>  </html> 

Output:

HTML DOM console log() MethodSupported Browsers:

  • Google Chrome
  • Edge
  • Internet Explorer 
  • Firefox
  • Opera
  • Safari

S

Shubrodeep Banerjee
Improve
Article Tags :
  • Web Technologies
  • HTML
  • HTML-DOM

Similar Reads

    HTML DOM images Collection Property
    The images collection property in HTML is used to return the collection of <img> elements in the document. It can be used for knowing the count of images inserted in the document using the <img> tag. The <input> elements with type = image are not counted in the image property.Synta
    4 min read
    HTML DOM console group() Method
    The console.group() method in HTML is used to create a group of messages in the console. It indicates the start of a message group and all the messages written after calling the console.group() method will write inside the message group. The label is sent as an optional parameter to the console.grou
    2 min read
    HTML DOM console.assert( ) Method
    The console.assert() method in HTML is used to write a message for the user on the console only if the expression evaluates to false. The expression and the message are sent as parameters to the console.assert() method. Syntax:console.assert( expression, message )Parameters: This method accepts two
    2 min read
    HTML DOM console.info() Method
    The console.info() method in HTML is used for writing a message in the console. It indicates an important message about any element or object. The message is sent as a parameter to the console.info() method.Syntax:  console.info( message )Parameters: This method accepts a single parameter message wh
    2 min read
    HTML DOM URL Property
    The DOM URL property in HTML is used to return a string that contains the complete URL of the current document. The string also includes the HTTP protocol such as ( http://).Syntax:document.URLReturn Value: It returns a string value that represents the full URL of the document. Example: In this exam
    2 min read
    HTML DOM head Property
    The head property in HTML is used to return the first occurrence of the head if multiple heads in the document. It returns the reference of the head object, which represents the <head> elementSyntax: document.headReturn value: It returns the <head> element of the head object.Example: The
    2 min read
    HTML DOM embeds Collection
    The DOM embeds collection property in HTML is used to return the collection of all embedded elements. The elements in the collection are sorted that appear in the source code. This property is used for read-only. Syntax: document.embedsProperty: This property contains a value length that returns the
    3 min read
    HTML DOM console warn() Method
    The console.warn() method is used to write a warning message in the console. So open the console to display the output (warning message). Syntax:console.warn( message )Parameters: This method accepts single parameter message which is mandatory. This parameter is used to hold the warning message. Exa
    2 min read
    HTML DOM console trace() Method
    This console.trace() method is used to display the trace which represents how the code ended up at a certain point. Syntax:console.trace( label )Parameters: This method accepts a single parameter label. Example: In this example, we will use a console.trace() methodHTML<!DOCTYPE html> <html
    2 min read
    HTML DOM title Property
    The DOM title property is used to return the title of the HTML document and also used to sets the value of the title in the document. This property is used to specify the information about the title.Syntax: It is used to return the title property document.titleIt is used to set the title property do
    2 min read
geeksforgeeks-footer-logo
Corporate & Communications Address:
A-143, 7th Floor, Sovereign Corporate Tower, Sector- 136, Noida, Uttar Pradesh (201305)
Registered Address:
K 061, Tower K, Gulshan Vivante Apartment, Sector 137, Noida, Gautam Buddh Nagar, Uttar Pradesh, 201305
GFG App on Play Store GFG App on App Store
Advertise with us
  • Company
  • About Us
  • Legal
  • Privacy Policy
  • In Media
  • Contact Us
  • Advertise with us
  • GFG Corporate Solution
  • Placement Training Program
  • Languages
  • Python
  • Java
  • C++
  • PHP
  • GoLang
  • SQL
  • R Language
  • Android Tutorial
  • Tutorials Archive
  • DSA
  • Data Structures
  • Algorithms
  • DSA for Beginners
  • Basic DSA Problems
  • DSA Roadmap
  • Top 100 DSA Interview Problems
  • DSA Roadmap by Sandeep Jain
  • All Cheat Sheets
  • Data Science & ML
  • Data Science With Python
  • Data Science For Beginner
  • Machine Learning
  • ML Maths
  • Data Visualisation
  • Pandas
  • NumPy
  • NLP
  • Deep Learning
  • Web Technologies
  • HTML
  • CSS
  • JavaScript
  • TypeScript
  • ReactJS
  • NextJS
  • Bootstrap
  • Web Design
  • Python Tutorial
  • Python Programming Examples
  • Python Projects
  • Python Tkinter
  • Python Web Scraping
  • OpenCV Tutorial
  • Python Interview Question
  • Django
  • Computer Science
  • Operating Systems
  • Computer Network
  • Database Management System
  • Software Engineering
  • Digital Logic Design
  • Engineering Maths
  • Software Development
  • Software Testing
  • DevOps
  • Git
  • Linux
  • AWS
  • Docker
  • Kubernetes
  • Azure
  • GCP
  • DevOps Roadmap
  • System Design
  • High Level Design
  • Low Level Design
  • UML Diagrams
  • Interview Guide
  • Design Patterns
  • OOAD
  • System Design Bootcamp
  • Interview Questions
  • Inteview Preparation
  • Competitive Programming
  • Top DS or Algo for CP
  • Company-Wise Recruitment Process
  • Company-Wise Preparation
  • Aptitude Preparation
  • Puzzles
  • School Subjects
  • Mathematics
  • Physics
  • Chemistry
  • Biology
  • Social Science
  • English Grammar
  • Commerce
  • World GK
  • GeeksforGeeks Videos
  • DSA
  • Python
  • Java
  • C++
  • Web Development
  • Data Science
  • CS Subjects
@GeeksforGeeks, Sanchhaya Education Private Limited, All rights reserved
We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy
Lightbox
Improvement
Suggest Changes
Help us improve. Share your suggestions to enhance the article. Contribute your expertise and make a difference in the GeeksforGeeks portal.
geeksforgeeks-suggest-icon
Create Improvement
Enhance the article with your expertise. Contribute to the GeeksforGeeks community and help create better learning resources for all.
geeksforgeeks-improvement-icon
Suggest Changes
min 4 words, max Words Limit:1000

Thank You!

Your suggestions are valuable to us.

What kind of Experience do you want to share?

Interview Experiences
Admission Experiences
Career Journeys
Work Experiences
Campus Experiences
Competitive Exam Experiences