Bagaimana saya bisa menampilkan konsol di biola di JSfiddle.com?
Saya baru-baru ini melihat sebuah biola yang memiliki konsol yang tertanam di dalam biola, ada yang tahu bagaimana ini bisa dilakukan?
javascript
console
jsfiddle
Adam Buchanan Smith
sumber
sumber
Jawaban:
Yang seharusnya menambahkan konsol sebaris ke bagian bawah tab hasil
sumber
cukup sederhana ..
contoh
github
Cukup tambahkan URL berikut ke Sumber Eksternal di jsfiddle, Anda akan melihat console.log dan console.error di layar hasil.
sumber
console.log('foo');
di kotak JS Andahttps://rawgit.com/eu81273/jsfiddle-console/master/console.js
https://cdn.jsdelivr.net/gh/eu81273/jsfiddle-console/console.js
sumber
Saya tidak dapat menemukan opsi apa pun untuk memilih ekstensi Firebug di opsi roda gigi JavaScript, dan saya tidak ingin menambahkan tautan / pustaka eksternal, tetapi ada satu lagi yang sederhana. solusi lainnya.
Anda dapat menggunakan konsol bawaan browser Anda
sumber
console.log()
bawaan Browser, saya dapat melihat hasil seperti yang Anda tunjukkan, tetapi saya masih tidak dapat berinteraksi dengan variabel di jsfiddle. Apakah ada cara untuk melakukannya?bekerja dengan baik ... di sini
sumber
Tidak ada solusi di atas yang berhasil untuk saya, karena saya membutuhkan konsol interaktif agar dapat secara dinamis menetapkan variabel saat menguji reaktivitas di Vue.js.
Jadi saya beralih ke Codepen , yang memiliki konsol interaktif yang mencakup aplikasi Anda.
sumber
Ada beberapa cara untuk menyematkan konsol virtual di dalam halaman web mana pun ...
1. Demo Firebug Lite Debugger
Sertakan skrip berikut dari Firebug Lite , disajikan melalui raw.githack.com :
https://rawcdn.githack.com/firebug/firebug-lite/firebug1.5/build/firebug-lite-debug.js
2. Stack Snippet Demo Konsol Virtual
Sertakan skrip berikut dari / u / canon , yang digunakan dalam Stack Snippets :
https://stacksnippets.net/scripts/snippet-javascript-console.min.js
3. Tambahkan Demo Konsol jsFiddle
Sertakan skrip berikut dari eu81273 , disajikan melalui raw.githack.com :
https://raw.githack.com/eu81273/jsfiddle-console/master/console.js
4. Gulung Anda Milik
Berikut adalah implementasi sepele yang membungkus
console.log
panggilan yang ada dan kemudian membuang argumen prettified menggunakan :document.write
Bacaan lebih lanjut
sumber
Untuk referensi di masa mendatang: jsfiddle-console dari jawaban persis seperti yang saya butuhkan saat mengajar kelas di JavaScript. Namun saya menemukan itu terlalu terbatas untuk digunakan dalam situasi ini. Jadi saya membuatnya sendiri.
Mungkin itu akan melayani siapa pun di sini.
Cukup tambahkan versi CDN ke sumber daya jsFiddle:
Contoh di sini: https://jsfiddle.net/Brutac/e5nsp2mu/
GitHub: https://github.com/karimayachi/html-console-output
sumber
Saya mungkin terlambat ke pesta tetapi hanya ingin menyebutkan bahwa JSfiddle baru saja merilis fitur konsol baru. Nyalakan saja di Pengaturan jika tidak berhasil untuk Anda.
Masih dalam versi beta tapi hei ... tidak ada lagi solusi yang mengganggu.
sumber