CODEWITHSUNDEEP
javascriptjsfiddle
aritroper
aritroper

Reputation: 1709

Print Var in JsFiddle

How would I print something to the result screen in JsFiddle from my JavaScript. I can't use document.write(), it doesn't allow it, neither print.

What should I use?

Upvotes: 205

Views: 99233

Answers (13)

spacebread
spacebread

Reputation: 531

I'm not sure why this isn't an answer or upvoted in the comment by Rubén

Nowadays jsfiddle allows the use of document.write() – Rubén Jul 16, 2018 at 19:05

Adding it as an answer for anyone looking.

Upvotes: 0

Emmanuel
Emmanuel

Reputation: 10870

If you're using JSfiddle, you can use this library: https://github.com/IonicaBizau/console.js

Add a rawgit of the lib to your jsfiddle resources: https://cdn.rawgit.com/IonicaBizau/console.js/0ee8fcc4ea802247c5a7a8e3c6530ede8ade308b/lib/console.min.js

Then you can just add this in the HTML:
<pre class="console"></pre>

Initialize the console in your JS:
ConsoleJS.init({selector: "pre.console"});

Usage Example: See it on jsfiddle

ConsoleJS.init({selector: "pre.console"});

let b;

console.log('hello world');
console.log([{'a':10,'b':44}]);
console.log(typeof [1,2,3,4]);
console.log(50 +67);
console.log(b);

Upvotes: 0

vkabachenko
vkabachenko

Reputation: 261

Now jsfiddle can do it from the scratch. Just go to Javascrpt --> Frameworks & extensions --> Jquery(edge) and check Firebug lite checkbox

Upvotes: 7

davidkelleher
davidkelleher

Reputation: 5338

To be able to see output from console.log() in JSFiddle, go to External Resources on the left-side panel and add the following link for Firebug:

https://getfirebug.com/firebug-lite-debug.js

Example of the result after adding firebug-lite-debug.js

Upvotes: 502

Igor Vaschuk
Igor Vaschuk

Reputation: 2924

document.body.innerHTML = "Your data";

Upvotes: 5

JohnPan
JohnPan

Reputation: 1210

With ES6 tricks could be

function say(...args)
{ 
    document.querySelector('#out').innerHTML += args.join("</br>");
}
say("hi","john");

Add only 

 <span id="out"></span>

in HTML

Upvotes: 4

Neph
Neph

Reputation: 418

Just to add something that might be useful to some folks....

If you add the debugger console as shown above, you can access the scope by executing this:

scope = angular.element(document.querySelector('[ng-controller=MyCtrl]')).scope();

I find inspecting the scope directly easier than console.log, alert(), etc.

Upvotes: 0

skibulk
skibulk

Reputation: 3188

Here's one alternative: http://jsfiddle.net/skibulk/erh7m9og/1/

document.write = function (str) {
    document.body.insertAdjacentHTML("beforeend", str);
}

document.write("¡hola mundo");

Upvotes: 3

Euphe
Euphe

Reputation: 3699

Might not do what you do, but you can type

console.log(string)

And it will print the string into the console of your browser. In chrome push CTRL + SHIFT + J to open the console.

Upvotes: 27

Ashutosh Jha
Ashutosh Jha

Reputation: 5

Use the alert() function:

alert(variable name);
alert("Hello World");

Upvotes: -4

IQAndreas
IQAndreas

Reputation: 8468

I have a template for this purpose; here is the code I use:

HTML

<pre id="output"></pre>

JavaScript

function out()
{
    var args = Array.prototype.slice.call(arguments, 0);
    document.getElementById('output').innerHTML += args.join(" ") + "\n";
}

Sample use (JavaScript)

out("Hello world!");
out("Your lottery numbers are:", Math.random(), 999, Math.PI);
out("Today is", new Date());

Upvotes: 69

Josh
Josh

Reputation: 2895

Try:

document.getElementById('element').innerHTML = ...;

Fiddle: http://jsfiddle.net/HKhw8/

Upvotes: 39

Adil Shaikh
Adil Shaikh

Reputation: 44740

You can do this ---> http://jsfiddle.net/chY5y/

$('body').append(yourVariable);

Upvotes: 8

Related Questions