복붙노트

[JQUERY] 자바 스크립트 콘솔에서 jQuery를 포함

JQUERY

자바 스크립트 콘솔에서 jQuery를 포함

해결법


  1. 1.브라우저의 자바 스크립트 콘솔에서이 프로그램을 실행 한 후 jQuery를 사용할 수 있어야 ...

    브라우저의 자바 스크립트 콘솔에서이 프로그램을 실행 한 후 jQuery를 사용할 수 있어야 ...

    var jq = document.createElement('script');
    jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(jq);
    // ... give time for script to load, then type (or see below for non wait option)
    jQuery.noConflict();
    

    참고 : 사이트 스크립트 jQuery로 충돌하는 (다른 libs와 등)이있는 경우 당신은 여전히 ​​문제로 실행할 수 있습니다.

    최고의 더 나은 만들기 북마크 정말 편리하게 만드는이의 그것을 할 수 있도록 만들고, 약간의 피드백이 너무 큰 :

    아래 형식의 코드는 다음과 같습니다

    javascript: (function(e, s) {
        e.src = s;
        e.onload = function() {
            jQuery.noConflict();
            console.log('jQuery injected');
        };
        document.head.appendChild(e);
    })(document.createElement('script'), '//code.jquery.com/jquery-latest.min.js')
    

    여기에 공식 jQuery를 CDN URL을 사용하는, 자신의 CDN / 버전을 사용하여 주시기 바랍니다.


  2. 2.콘솔이 실행

    콘솔이 실행

    var script = document.createElement('script');script.src = "https://code.jquery.com/jquery-3.4.1.min.js";document.getElementsByTagName('head')[0].appendChild(script);
    

    그것은 새로운 스크립트 태그를 생성 jQuery를 함께 채우고 머리에 추가합니다.


  3. 3.모든 것을에서 복사 : https://code.jquery.com/jquery-3.4.1.min.js

    모든 것을에서 복사 : https://code.jquery.com/jquery-3.4.1.min.js

    그리고 콘솔에 붙여 넣습니다. 완벽하게 작동합니다.


  4. 4.jQueryify 소책자를 사용합니다 :

    jQueryify 소책자를 사용합니다 :

    http://marklets.com/jQuerify.aspx

    대신 다른 답변에서 코드를 붙여 복사의이 그것을 클릭 할 수있는 북마크 할 수 있습니다.


  5. 5.@ jondavidjohn의 대답에 추가, 우리는 또한 자바 스크립트 코드로 URL을 책갈피로 설정할 수 있습니다.

    @ jondavidjohn의 대답에 추가, 우리는 또한 자바 스크립트 코드로 URL을 책갈피로 설정할 수 있습니다.

    이름 : jQuery를 포함

    URL :

    javascript:var jq = document.createElement('script');jq.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";document.getElementsByTagName('head')[0].appendChild(jq); setTimeout(function() {jQuery.noConflict(); console.log('jQuery loaded'); }, 1000);void(0);
    

    다음 대신 또 다시 스크립트를 붙여, 우리는 단지 북마크를 클릭 할 수 있도록 크롬이나 파이어 폭스의 도구 모음에 추가합니다.


  6. 6.나는 반역자입니다.

    나는 반역자입니다.

    해결 방법 : jQuery를 사용하지 마십시오. jQuery를가 브라우저에서 추상화 DOM의 inconcistencies에 대한 라이브러리입니다. 당신이 당신의 자신의 콘솔에있어 때문에, 당신은 추상화의이 종류를 필요가 없습니다.

    귀하의 예를 들어 :

    $$('element').length
    

    ($$ 콘솔에서 document.querySelectorAll 별칭입니다.)

    다른 예를 들면 : 나는 아무것도 찾을 수 있습니다 확신합니다. 특히 당신은 현대적인 브라우저 (크롬, FF, 사파리, 오페라)를 사용하는 경우.

    게다가, DOM 작동하지 상처 사람이, 그것은 단지 jQuery를의 수준을 증가시킬 것입니다 방법을 아는 것은 (예, 더 자바 스크립트에 대해 학습 jQuery를에 더 나은 서비스를한다).


  7. 7.난 그냥 (이미로드 된 경우 경우 오류로드하는 동안 오류 메시지 버전을 감지, 이미로드되지 않은 경우에만 부하) 오류 처리와 jQuery를 3.2.1 북마크를했다. 크롬 27에서 테스트 jQuery를 2.0 이후 크롬 브라우저의 "이전"jQuery를 1.9.1을 사용하는 이유가 없습니다 것은 API 호환 1.9입니다.

    난 그냥 (이미로드 된 경우 경우 오류로드하는 동안 오류 메시지 버전을 감지, 이미로드되지 않은 경우에만 부하) 오류 처리와 jQuery를 3.2.1 북마크를했다. 크롬 27에서 테스트 jQuery를 2.0 이후 크롬 브라우저의 "이전"jQuery를 1.9.1을 사용하는 이유가 없습니다 것은 API 호환 1.9입니다.

    그냥 크롬의 개발자 콘솔이나 드래그 다음을 실행 및 북마크 표시 줄에 드롭 :

    javascript:((function(){if(typeof(jQuery)=="undefined"){window.jQuery="loading";var a=document.createElement("script");a.type="text/javascript";a.src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js";a.onload=function(){console.log("jQuery "+jQuery.fn.jquery+" loaded successfully.")};a.onerror=function(){delete jQuery;alert("Error while loading jQuery!")};document.getElementsByTagName("head")[0].appendChild(a)}else{if(typeof(jQuery)=="function"){alert("jQuery ("+jQuery.fn.jquery+") is already loaded!")}else{alert("jQuery is already loading...")}}})())
    

    읽을 수있는 소스 코드는 여기에서 확인할 수 있습니다


  8. 8.jondavidjohn하여 상단의 대답은 잘하지만 난 점 몇 가지를 해결하기 위해 그것을 조정할 싶습니다

    jondavidjohn하여 상단의 대답은 잘하지만 난 점 몇 가지를 해결하기 위해 그것을 조정할 싶습니다

    내 유일한 문제는 내가 콘솔에서 정말 항상 최신을 원하는 버전 번호를 포함해야한다는 것입니다.

    var jq = document.createElement('script');
    jq.src = "//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(jq);
    jQuery.noConflict();
    

  9. 9.이 답변 별 :

    이 답변 별 :

    fetch('https://code.jquery.com/jquery-latest.min.js').then(r => r.text()).then(r => eval(r))
    

    어떤 이유로 나는 (내가 아니라 다른 방법으로해야 할) 새로운 '$'를 얻기 위해 두 번 실행해야하지만, 그것을 작동합니다.

    브라우저가 너무 현대가 아닌 경우이 동일합니다 :

    fetch('http://code.jquery.com/jquery-latest.min.js').then(function(r){return r.text()}).then(function(r){eval(r)})
    

  10. 10.다른 답변이 설명하는 것처럼 수동으로이 일을 매우 간단합니다. 그러나 또한 jQuerify 플러그인이있다.

    다른 답변이 설명하는 것처럼 수동으로이 일을 매우 간단합니다. 그러나 또한 jQuerify 플러그인이있다.


  11. 11.FWIW는, 방화범은 특별한 명령을 포함 내장하고, JQuery와는 기본적으로 별칭이있다 : https://getfirebug.com/wiki/index.php/Include

    FWIW는, 방화범은 특별한 명령을 포함 내장하고, JQuery와는 기본적으로 별칭이있다 : https://getfirebug.com/wiki/index.php/Include

    따라서 귀하의 경우, 당신은 단지 입력해야합니다 :

    include("jquery");
    

    플로랑


  12. 12.@genesis의 답변에 따라이 대답은, 첫째 I에 북마크 버전 @jondavidjohn을 시도하고, 나는이 (북마크에 추가)로 변경, 그래서 그것은 작동하지 않습니다 :

    @genesis의 답변에 따라이 대답은, 첫째 I에 북마크 버전 @jondavidjohn을 시도하고, 나는이 (북마크에 추가)로 변경, 그래서 그것은 작동하지 않습니다 :

    javascript:(function(){var s = document.createElement('script');s.src = "//code.jquery.com/jquery-2.2.4.min.js";document.getElementsByTagName('head')[0].appendChild(s);console.log('jquery loaded')}());
    

    주의 말씀은, 파이어 폭스에서 크롬하지만 일에 테스트하지 않았으며 충돌 환경에서 테스트되지 않습니다.


  13. 13.가장 짧은 방법 중 하나는 바로 콘솔에 아래의 코드를 붙여 복사됩니다.

    가장 짧은 방법 중 하나는 바로 콘솔에 아래의 코드를 붙여 복사됩니다.

    var jquery = document.createElement('script'); 
    jquery.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js";
    document.head.appendChild(jquery);
    

  14. 14.(웹 사이트 창을 사용하여 무엇인가를 정의하지 않는 경우. $) (크롬, 파이어 폭스, 사파리에서 테스트) 현대 브라우저는 jQuery를 매우 유사 달러 기호 $를 사용하여 일부 도우미 기능을 구현합니다.

    (웹 사이트 창을 사용하여 무엇인가를 정의하지 않는 경우. $) (크롬, 파이어 폭스, 사파리에서 테스트) 현대 브라우저는 jQuery를 매우 유사 달러 기호 $를 사용하여 일부 도우미 기능을 구현합니다.

    이러한 유틸리티는 DOM에서 요소를 선택하고이를 수정하기위한 매우 유용합니다.

    문서 도구 : 크롬, 파이어 폭스


  15. 15.당신이 userscript을 위해이 일을 찾고 있다면, 내가 쓴 : http://userscripts.org/scripts/show/123588

    당신이 userscript을 위해이 일을 찾고 있다면, 내가 쓴 : http://userscripts.org/scripts/show/123588

    그것은 당신이 jQuery를, 플러스 UI 당신이 원하는 어떤 플러그인을 포함 할 수 있습니다. 나는 1.5.1없이 UI가있는 사이트를 사용하고 있습니다; 이 스크립트 대신 나에게 1.7.1를 제공하지 플러스 UI 및 크롬 또는 FF에서 충돌. 나는 오페라 자신을 테스트하지했지만, 다른 사람들이 꽤 잘 완전한 크로스 브라우저 userscript 솔루션되어야한다 그래서 당신이이 작업을 수행 할 필요가 무엇 경우는,뿐만 아니라 그들을 위해이 일 것 얘기했다.


  16. 16.여기에 다른 코드는 다음과 같습니다

    여기에 다른 코드는 다음과 같습니다

    javascript:(function() {var url = '//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'; var n=document.createElement('script');n.setAttribute('language','JavaScript');n.setAttribute('src',url+'?rand='+new Date().getTime());document.body.appendChild(n);})();
    

    콘솔에서 직접 붙여 넣거나 새로운 북마크 페이지를 만들 수있는 (북마크 바에서 마우스 오른쪽 단추로 클릭 크롬을, 페이지 추가 ...) 및 URL로이 코드를 붙여 넣습니다.

    그 일을하는 경우 테스트하려면 아래를 참조하십시오.

    전에:

    $()
    Uncaught TypeError: $ is not a function(…)
    

    후:

    $()
    []
    

  17. 17.콘솔에서 자주 jQuery를 사용하려면 당신은 쉽게 userscript를 작성할 수 있습니다. 당신이 파이어 폭스에있는 경우 크롬과 그리스 몽키에있는 경우 첫째, Tampermonkey를 설치합니다. 이 같은 사용 기능을 가진 간단한의 userscript 쓰기 :

    콘솔에서 자주 jQuery를 사용하려면 당신은 쉽게 userscript를 작성할 수 있습니다. 당신이 파이어 폭스에있는 경우 크롬과 그리스 몽키에있는 경우 첫째, Tampermonkey를 설치합니다. 이 같은 사용 기능을 가진 간단한의 userscript 쓰기 :

    var scripts = [];
    
    function use(libname) {
        var src;
        if (scripts.indexOf(libname) == -1) {
            switch (libname.toLowerCase()) {
                case "jquery":
                    src = "//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js";
                    break;
                case "angularjs":
                    src = "//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js";
                    break;
            }
        } else {
            console.log("Library already in use.");
            return;
        }
        if (src) {
            scripts.append(libname);
            var script = document.createElement("script");
            script.src = src;
            document.body.appendChild(scr);
        } else {
            console.log("Invalid Library.");
            return;
        }
    }
    

  18. 18.yourCode_here 기능에 코드를 넣습니다. 그리고 HEAD 태그없이 HTML을 방지 할 수 있습니다.

    yourCode_here 기능에 코드를 넣습니다. 그리고 HEAD 태그없이 HTML을 방지 할 수 있습니다.

    (함수 (헤드) { VAR JQ = document.createElement ( '스크립트'); jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"; ((헤드 && 헤드 [0]) || document.firstChild) .appendChild (JQ); }) (document.getElementsByTagName ( "헤드")); jQueryReady 함수 () { 경우 (window.jQuery) { jQuery.noConflict (); yourCode_here (jQuery를); } 다른 { 에서는 setTimeout (jQueryReady, 100); } } jQueryReady (); 기능 yourCode_here ($) { CONSOLE.LOG ( "OK"); $ ( "몸") HTML ( "

    안녕하세요 세계 !."); }


  19. 19.직관적 인 한 줄

    직관적 인 한 줄

    document.write(unescape('%3Cscript src="https://code.jquery.com/jquery-3.1.1.min.js"%3E%3C/script%3E’))
    

    당신은 SRC 주소를 변경할 수 있습니다. 내가 ReferenceError가 언급 : 변수를 찾을 수 없습니다 : jQuery를


  20. 20.포스트 2020 방법, ES7 동적 가져 오기를 사용!

    포스트 2020 방법, ES7 동적 가져 오기를 사용!

    (비동기 () => { await를 가져 오기 ( 'https://code.jquery.com/jquery-2.2.4.min.js') // 라이브러리 준비 CONSOLE.LOG (jQuery를) }) ()

    https://caniuse.com/es6-module-dynamic-import

  21. from https://stackoverflow.com/questions/7474354/include-jquery-in-the-javascript-console by cc-by-sa and MIT license