How can I test jQuery code in the browser console?-CodePudding

I want to test if my jQuery code is sound. So I thought I just enter the code in the browser console. I use Mozilla Firefox.

I want to test if I can select ids and that stuff.

But when I enter:

$("#testId")

I get the following error:

Uncaught SyntaxError: private names aren't valid in this context

Are the elements that I want to access private? What does that mean and why is that?

CodePudding user response：

follow these steps to test & practice JQuery in your console: first, use the browser debugger tool to inspect any element in your browser, view the source code, e.g like classNames and id'

Next, now use the jQuery syntax to select it example $(".className") or $("#ids"),

CodePudding user response：

just type

console.log($("#testId"));

CodePudding user response：

Try something like this

<div id="testId">hi user1664377</div>

then

console.log($("#testId").text()); // you will see "hi user1664377" in console

CodePudding user response：

In case you dont have access to jQuery in console (window/document).

You can add the jQuery script to DOM directly from console by creating and appending the script to body:

let s = document.createElement('script')
s.setAttribute('src','https://code.jquery.com/jquery-3.6.0.min.js')
document.getElementsByTagName('body')[0].appendChild(s)

And now eg get the jQuery version:

console.log(jQuery.fn.jquery)