javascript - data needed

Currently, I am diving into practicing javascript coding on CodeAcademy. While testing out my code in Codeacademy, I rely on console.log to display strings to the built-in browser within the platform. Everything runs smoothly there. The challenge arises when I test the exact same piece of code in Dreamweaver text editor and try to output it to the browser - it shows nothing until I switch to using document.write.

Subsequently, I came across information stating that utilizing document.write in production code is not advisable! Could someone shed some light on this?

Moreover, during a recent JS free meeting I attended, it was emphasized that incorporating something like prompt("La di da"); is also discouraged in professional projects.

If anyone is willing to spare some time and knowledge to explain why these features are included in JS but not recommended for use, or why they malfunction when implemented, I would greatly appreciate it.

Answer №1

  1. In their web application, Code Academy will create a simulated console. By pressing "F12" in most browsers, users can access the "Developer Tools," which include a built-in console where output from console.* calls like console.log() is displayed. Code Academy will have its own JavaScript to capture and display these calls for user convenience.

    However, Dreamweaver does not provide this feature, explaining why it may not be visible to you.

  2. Using document.write is not inherently wrong. However, its behavior changes based on whether the page has loaded or not. There are more user-friendly alternatives like document.getElementById() for specifying the output location.

    For further information, refer to Why is document.write considered a "bad practice"?

  3. Just like document.write, using functions like prompt() and confirm() is not problematic; even Stack Overflow utilizes confirm() on their websites. The drawback is that they lack customization options, and functionalities like prompt() only allow one input at a time.

    On the other hand, modal windows (such as jQuery UI dialog, Bootstraps "Model", or different lightbox plugins) offer styling capabilities.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is it possible to utilize an if statement to select a specific Bootstrap modal?

How can I make a modal appear when the user clicks select? The first page has radio buttons (e.g. oneway, twoway), and I want the second page to display different fields based on which radio button is selected. Can I use an if statement for this? If so, ...

How can I extract information from an iCal file to display the upcoming event?

Is there a method to extract information from an iCalendar file and display the most recent event using JavaScript or node.js? Your assistance on this matter would be greatly valued. Many thanks ...

What is the most efficient way to halt the pipe if the value of an HTML input element remains unchanged using RxJS?

I'm currently incorporating RxJS into my Angular 9 project. My goal is to bind a keyup event to an input field and trigger an HTTP request whenever the user types a new value. Here's the code snippet I have: fromEvent(this.inputBox.nativeElemen ...

Synchronous execution of functions in Node.js

I need to ensure that func2 is only called after func1 has completed its execution. { func1(); func2();// } However, the issue arises when func1() starts running and func2() does not wait for it to finish. This leads to a runtime error as func2() require ...

Dynamically updating fields in PHP using jQuery's passed variable

In my web application, I have a selection of locker numbers available in a dropdown list that is populated from MYSQL/PHP. My goal is to display each locker's combination and location when a user selects a locker number from the dropdown list on the s ...

Discovering the Authentic Page upon Completion of Load using PhantomJS

I am facing an issue while automatically downloading a theme on Wordpress using PhantomJS. The problem arises because the page is not fully evaluated even after it appears to be done loading. When trying to interact with elements on the page, such as clic ...

Comparing the $viewValue in AngularJS with the ng-model attribute or an object parameter

I am working on a dynamic form that uses ng-min/ng-max for validation. The ng-max and ng-min are connected to object parameters modelParam.maxvalue and modelParam.minvalue. I need to show an alert or error message if the value entered in the form field goe ...

Utilize ModifyDOM to erase text triggered by selecting a radio button

I have created a form that includes four radio buttons along with a reset button to clear the form. When a radio button is selected, information is displayed using "displayText". I am looking to add an onclick handler to trigger a function that will delete ...

Encountering a type error while trying to create a document within a nested collection in Firebase Firestore

While trying to submit the form with property data, I encountered an error message: FirebaseError: Expected type 'za', but it was: a custom Ha object. There doesn't seem to be any information available online explaining what a Ha object is o ...

"Transforming Selections in Illustrator through Scripting: A Step-by-Step Guide

In Illustrator, I successfully used an ExtendScript Toolkit JavaScript code to select multiple elements like text, paths, and symbols across different layers. Now, I am looking to resize them uniformly and then reposition them together. While I can apply ...

Problems with Ajax functionality

Excuse my rusty JavaScript skills but I'm attempting to use an AJAX call to a PHP file, pass it a plan type, and then determine if there are enough available slots for the plan. If so, return true; otherwise, false. Below is the Form in XHTML: <fo ...

Is it better to Vuex - manipulate store item twice, trigger new items, or perform transformations within components each time they are mounted?

I am considering performing two separate transformations on a single, large store item and then saving the results as two new store items. For instance: setEventsData: (state, data) => {...} // main huge master object // perform transformations on it an ...

Press anywhere else on the screen to dismiss the bootstrap menu

I've been attempting to find a solution for closing the Bootstrap menu when clicking outside of it in a mobile window size, but I just can't seem to make it work. I did manage to get it working when clicking one of the 'a' links using t ...

Creating an array of a specific field within a JSON string using the collect() method of objx is a straightforward process

Here is the JSON string I am working with: var data = [{"first":"3","second":"1"},{"first":"5","second":"5"},{"first":"7","second":"1"}]; Currently, I am using the following code - objx(data).collect("first") I am expecting to receive an array like [3 ...

Every time I attempt to build a React application, I encounter the same error message. I even checked the log file, but it keeps showing the proxy error

An error occurred in the command prompt while installing packages. This process may take a few minutes. Installing react, react-dom, and react-scripts with cra-template... Error: ERR_SOCKET_TIMEOUT The network encountered a socket timeout while trying to ...

How can I create an efficient chat system using Ajax and settimeout without causing excessive virtual memory usage?

I'm in the process of creating a chat application using AJAX that fetches data every second with setTimeout. I have drafted a basic code where there is a number that increments each second by the number retrieved from the PHP page2. Upon testing it on ...

Struggles with establishing a connection to the Gmail API

I am facing some challenges connecting to the Gmail API. Despite completing the setup process and obtaining a valid token on OAuth 2.0 Playground, I encounter errors when trying to send mail from a form on my Node.js / Express / Nodemailer server. The term ...

What causes immediately invoked functions within event handlers to be executed before the event is triggered?

let b = (function maria() { alert("ee"); })(); * this code runs as soon as the page loads * <button onclick="b">Click me</button> * this code only runs when button is clicked * <button onclick="alert('ee')">Click m ...

Ways to adjust your selection to the space or new line before or after

$('button').on('click', function(){ const selection = window.getSelection(); selection?.modify('move', 'backward', 'word'); selection?.modify('extend', 'forward', 'to the next space ...

The x-axis is represented by JSON keys, while the y-axis is represented by

I am currently attempting to replicate a graph that was originally made in Excel. Here is the code I have written so far: var data = [ { 'FB':4, 'Mv':4, 'CB':5, 'SL':3, ...