Menu
Using the Chrome browser, right click / control click anywhere inside your content area and select Inspect Element. In Chrome, right-click (or control + click) in the content area and choose "Inspect Element" to open the element inspector.
There is no way to show number line in developer area. You can press CTRL+U in the webpage where you want to see the line on code. Good luck
Don't know how useful it will be, but you can right click on the html element in the Elements tab, select "Copy as HTML" and paste the results in your favorite text editor. That will give you line numbers for the DOM as it exists at the point where you copy it.
Like the comments point out, this will not correspond to source line numbers.
If you go to View Page Source, this will show the current line numbers. Either right-click -> View Page Source, or hit Ctrl+U on Windows, or Cmd+Option+U on Mac.
For what it's worth, I needed this because I was getting a javascript error with a line number. The dev tools weren't showing this snippet in the regular source tab, presumably because it was embedded in HTML and I had a compilation error (stupid missing comma).
Press "F12" or go the Developer Tools. Click on the Sources tab double click the already selected file in the pane to the left. See screenshot of this web page below.
It doesn't have a line number because it's the parsed and corrected version of your HTML code and the line numbers might be very different from what you see in you code editor. The best way to find exactly the same element is to add an ID attribute to the element and then use document.querySelectorAll('#CUSTOM_ID'); If you want to see the unchanged HTML (what browser received from server) just right click on the page and choose view page source.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With