[javascript] jsfiddle 내부에서 콘솔을 얻는 방법

JSfiddle.com의 바이올린에 콘솔을 표시하려면 어떻게해야합니까?

나는 최근에 바이올린에 콘솔이 내장 된 바이올린을 보았는데, 이것이 어떻게 할 수 있는지 아는 사람이 있습니까?



답변

  1. 자바 스크립트 패널 확장
  2. jQuery Edge 선택
  3. Firebug Lite를 선택하십시오 .

설정 예

결과 탭 하단에 인라인 콘솔을 추가해야합니다.

출력 예


답변

아주 간단합니다 ..

github

jsfiddle의 외부 리소스에 다음 URL을 추가하면 결과 화면에 console.log 및 console.error가 표시됩니다.

https://cdn.jsdelivr.net/gh/eu81273/jsfiddle-console/console.js


답변

  • JavaScript 옆의 화살표를 클릭하십시오.
  • 와 같은 프레임 워크 및 확장 선택 노 Libary (순수한 JS)를
  • console.log('foo');JS 상자에 붙여 넣기
  • 아래 리소스 추가https://rawgit.com/eu81273/jsfiddle-console/master/console.js
    • 또는 : 리소스에서 추가https://cdn.jsdelivr.net/gh/eu81273/jsfiddle-console/console.js
  • 재생 버튼을 눌러 스크립트를 실행합니다.


답변

JavaScript 기어 옵션에서 Firebug 확장을 선택하는 옵션을 찾을 수 없었고 외부 링크 / 라이브러리를 추가하고 싶지 않았지만 또 다른 간단한 솔루션이 있습니다.

브라우저에 내장 된 콘솔을 사용할 수 있습니다.

개발 도구 콘솔


답변

잘 작동합니다 … 여기

var consoleLine = "<p class=\"console-line\"></p>";

console = {
    log: function (text) {
        $("#console-log").append($(consoleLine).html(text));
    }
};
console.log("Hello Console")


답변

Vue.js에서 반응성을 테스트 할 때 변수를 동적으로 설정할 수 있는 대화 형 콘솔 이 필요했기 때문에 위의 솔루션 중 어느 것도 저에게 효과 가 없었습니다.

그래서 저는 여러분의 애플리케이션에 맞는 대화 형 콘솔 이있는 Codepen으로 전환했습니다 .

CodePen 예


답변

웹 페이지 내부에 가상 콘솔 을 삽입하는 방법에는 여러 가지가 있습니다 .

1. Firebug Lite 디버거 데모

raw.githack.com을 통해 제공 되는 Firebug Lite 의 다음 스크립트를 포함합니다 .

https://rawcdn.githack.com/firebug/firebug-lite/firebug1.5/build/firebug-lite-debug.js

개똥 벌레

2. 스택 스 니펫 가상 콘솔 데모

스택 스 니펫 에서 사용되는 / u / canon 의 다음 스크립트를 포함합니다 .

https://stacksnippets.net/scripts/snippet-javascript-console.min.js

스택 스 니펫

3. jsFiddle 콘솔 데모 추가

raw.githack.com을 통해 제공되는 eu81273 의 다음 스크립트를 포함합니다 .

https://raw.githack.com/eu81273/jsfiddle-console/master/console.js

jsFiddle 콘솔

4. 당신이 소유 한 롤

여기에 기존의 랩 사소한 구현의 console.log아웃 덤프 후 전화를하고 prettified 인수를 사용하여는 document.write:

var oldLog = window.console.log
window.console.log = function(...args) {
    document.write(JSON.stringify(args, null, 2));
    oldLog.apply(this, args);
}

console.log("String", 44, {name: "Kyle", age: 30}, [1,2,3])

추가 읽기