I'm learning more about jQuery and would like to use it interactively at the JavaScript console in Chrome. Is that possible? I envision something like this, but it doesn't work:
> use('jquery.js')
jquery loaded
> $("span").html("Hello World!")
This would cause "Hello World!" to be inserted between the span tags and displayed.
There is no "use" so of course it will not work.
You can append it to a page.
var scr = document.createElement("script");
scr.src = "http://code.jquery.com/jquery-1.9.1.min.js";
document.body.appendChild(scr);
Blocked loading mixed active content “http://code.jquery.com/jquery-1.9.1.min.js”If you have jQuery included in the page that you have the console open on you should be free to use it in the console.
Never mind. Figured it out :-) I created a simple HTML file that loaded jQuery and then went into the console. This works for me.
You may want to check out http://jsfiddle.net/ or http://codepen.io/pen/
You can still access the scripts you create via the chrome console and it will be easier to share with others if you have any questions.
If you want to use jQuery frequently from the console you can easily write a userscript. First, install Tampermonkey if you are on Chrome and Greasemonkey if you are on Firefox. Write a simple userscript with a use function like this:
var scripts = []
function use(libname){
var src;
if(scripts.indexOf(libname)==-1){
switch(libname.toLowerCase()){
case "jquery":
src = "http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js";
break;
case "angularjs":
src = "http://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;
}
}
// jquery():-)