Where can I find the function called by onclick using Inspect Element of Chrome?

Viewed 4922

I found in my university website there is a button to add course. Where can I find the function addNewCourseToStudent()details using inspect element of the google chrome.

<button onclick="addNewCourseToStudent()">Add</button>

2 Answers

An inline handler will almost certainly be referencing a global variable, so you can open the console and log the variable, which will give you the function location and its code:

const foo = 'some code';
function fn() {
  console.log('fn running');
}

// when you have the function name, console.dir it
// to find its location:
console.dir(fn);
// console.log it to find its code:
console.log(fn);

enter image description here

You can click on the link to the right of the [[FunctionLocation]] to get to the place in the Sources panel where the function is defined.

Right click inspect the tag or button,
Choose the Event Listeners Tab in the developer tools as shown below

Ctrl Shift I

Expand click it won't show as onclick it will show as click

enter image description here

Related