Copying HTML code in Google Chrome's inspect element

Question

I have a website of which I want to copy an HTML code from - how do I copy all the text in inspect element - so I don't get the website's HTML code, but the code that I have already changed so that I don't have elements I don't want in my own webpage?

Thank you, should have figured it out. Fastest answer ever... — user3581631, Apr 28 '14 at 14:05
possible duplicate of [Chrome Dev Tools export Elements HTML](http://stackoverflow.com/questions/28151446/chrome-dev-tools-export-elements-html) — Konrad Dzwinel, Jun 15 '15 at 12:22
Does this answer your question? [Copying Code from Inspect Element in Google Chrome](https://stackoverflow.com/questions/12576247/copying-code-from-inspect-element-in-google-chrome) — Ivan Chau, Jan 30 '23 at 07:43

score 112 · Answer 1 · edited May 30 '21 at 12:18

112

Do the following:

Select the top most element, you want to copy. (To copy all, select <html>)
Right click.
Select Edit as HTML
New sub-window opens up with the HTML text.
This is your chance. Press CTRL+A/CTRL+C and copy the entire text field to a different window.

it's the easiest way to do this.

edited May 30 '21 at 12:18

7ua

3
1
3

answered Dec 18 '15 at 22:44

barryjones

2,149
1
17
21

I've slightly edited your answer to use Markdown formatting instead of manual stuff. I'd recommend learning Markdown, if only because your posts become so much prettier :) – Nic Jul 18 '16 at 21:22
1

It copies all page elements but it does not copy inputted values. How can I copy the page source and the input values together? @barryjones – amIllusionist May 30 '20 at 17:10

score 23 · Answer 2 · answered Jun 22 '17 at 16:53

23

Right click → copy → copy element

answered Jun 22 '17 at 16:53

Vincent Tang

3,758
6
45
63

1

It copies all page elements but it does not copy inputted values. How can I copy the page source and the input values together? – amIllusionist May 30 '20 at 17:10

score 7 · Answer 3 · answered Jul 29 '16 at 11:27

7

Select the <html> tag in Elements.
Do CTRL-C.
Check if there is only lefting <!DOCTYPE html> before the <html>.

answered Jul 29 '16 at 11:27

Pedro Reis

1,587
1
19
19

score 1 · Answer 4 · edited Aug 05 '21 at 09:08

1

Using HTTrack software you can download all the website content to your local directory. HTTrack: http://www.httrack.com/

edited Aug 05 '21 at 09:08

justryingouthere

27
8

answered Mar 16 '20 at 04:58

Dilshan Dilip

707
6
9

1

This is the more correct answer. Copy element copies the source of the page and not the rendered content :( – djack109 May 26 '20 at 18:07

score 0 · Answer 5 · edited Feb 11 '21 at 20:32

0

This is bit tricky

Now a days most of website new techniques to save websites from scraping

1st Technique

Ctrl+U this will show you Page Source

2nd Technique

This one is small hack if the website has ajax like functionality.

Just Hover the mouse key on inspect element untill whole screen becomes just right click then and copy element

That's it you are good to go.

edited Feb 11 '21 at 20:32

DisappointedByUnaccountableMod

6,656
4
18
22

answered Feb 11 '21 at 14:09

Ahmed Mujtaba

744
5
16

Copying HTML code in Google Chrome's inspect element

5 Answers5

Linked