CODEWITHSUNDEEP
javascripthtml
Md Rimon
Md Rimon

Reputation: 51

How to show JavaScript output in page source code

In my web page i have use some JavaScript and its works fine and result shows what i needed. but when i go to view page source i have seen only JavaScript code but can not see the output. Below is my code.

  var link = document.createElement('link');
  link.setAttribute('rel', 'canonical');
  link.setAttribute('href', location.protocol + '//' + location.host + location.pathname);
  document.head.appendChild(link);
</script>

This code woks good. when i click on "Inspect" on Google chrome i can see the its works. but an not see the output when i click on "View page source".

Can any one tell me how to show the output result in source code??

Upvotes: 3

Views: 2942

Answers (3)

sabeen kanwal
sabeen kanwal

Reputation: 607

View Source and Inspect Element are two browser features that allow developers to look at the HTML for a particular page.

view simply shows the HTML as it was delivered from the web server to our browser or client side.

When we inspect an element in Chrome developer tools (using the right-click menu or F12), we are looking at the current state of the DOM tree after:

HTML error correction by the browser or HTML normalization by the browser or DOM manipulation by JavaScript

Upvotes: 0

Leftium
Leftium

Reputation: 17903

In Chrome, if you right-click the element and select "Inspect" the current DOM will be shown in the developer tools Elements panel. It will resemble HTML from "view page source," and include any changes you have made to the DOM via JS.

Upvotes: 1

Ajit Kumar
Ajit Kumar

Reputation: 1505

The view page source context menu option only show whats rendered from the server side. It does not contain whatever rendered on the client side.

If you want to see client side rendering you use inspect element.

Upvotes: 2

Related Questions