Copy HTML code but without javascript changes - html

In Firebug there is very useful "Copy HTML" option in HTML Tab. But that copied HTML code also includes javascript changes like for example added new classes on document.ready (jQuery) event. I would like to copy raw HTML code like in "View source" option (it is every browser) without and javascript changes. Yes, I can use "View source" option but code in there is very scattered and it is very hard to copy one big HTML node not losing closing tag and in firebug with fold blessing I can match folded HTML node, right click and select "Copy HTML".

Fetch the SAME page from the server using an AJAX call, assign it to a variable. Done.

Related

How to show completed html source on chrome?

I'm trying to take the full html source of the tab in
this page
I want to take the source of
this tab
But unfortunately, the html I'm getting is not completed.
I registered a gif to explain it better
That select list is showing just when I inspect the element, while If I just insect the element with the list closed, it doesn't return any list html.. is it created dinamically when the user click on it?
I've tried to expand all the codes, but unfortunately it seems the html of every list is not appearing.. It might be created just when I open the list?
Is there a way to get the lists html?
Hope I've been clear.
Not sure what you want to save, but by inspecting it sources, it seems that the website use the way of removing and appending the html source which means only you pressed the expanded button, Javascript will append it (different options) to the body, otherwise it will not shown in the element tab.
I don't think you could get all html tags in just 1 try because the website use Javascript to append the html and you can't see it in the element section in console when the element is being removed.
Example:
You can save the page if you want. Just save it with Ctrl+S and you will find the basic source in there along with the stylesheet and other scripts.

How to view HTML source without refreshing the page in Chrome

I need to view all source HTML in plain text in one place. I need it from an already loaded page. CTRL+U (View Source) refreshes the page. The page I'm trying to view can only be accessed via proper form submit. What I really want is for CTRL+U to not refresh the page.
I need the HTML source of an already loaded page added to my clipboard.
I think none of the other answers really answer your question.
You want the exact response from the server, not the current DOM, and you want it with the exact request headers that was sent the first time.
To do so, open the Chrome Dev Tools and select the "Network" tab.
The very first request should be the page you requested. Click it and select the tab "Response" on the right side to get the exact response the server gave you.
Right click-> inspect element anywhere you want to see the html, it still show the code of all the page ans you can modify the value of html/css directly in it.
The only answer is the one Dor1000 provided himself in a comment:
dev tools, elements tab, right click html tag, copy, copy outer html.
He wants the current HTML (after javascript or any other modifications, not the original source HTML).

Getting the generated sourcecode of a page in notepad

Is there any way of getting the source code of an HTML browser-page that is showing when i click inspect element(in chrome of firefox) and put it in a notepad(automatically) or maybe accessing it automatically somehow.
I do not want the original sourcecode but the one that is generated after all the javascripts have already run.
I would like to use the code afterwards in another web page and parse it...
later edit: i can actually click the html in the inspect element and click copy html but i need for a nother site to automatically acces this information because i will try reloading the site at regular intervals and need to constantly get the new html
With Firebug's HTML tab, you can right click on the element, and click "Copy HTML".
See also this post:
how to get fully computed HTML (instead of source HTML)?
press ctrl+u then it will display source code of html page then go to file menu and save it as html file in your system. then you can open it in html or another editor like netbeans /dreamviewer/notepad. I suggest you to open it in netbeans or dreamviewer will be better then open it in notped.
thanks.
You can use the web developer plugin for Firefox or Chrome. It gives you the generated source of a page.
In Opera , Right Click -> click on Inspect Element -> right click on <html> tag -> click on Edit Markup, from there you can copy the entire HTML code.
Edit -> In Oprea, right click on the page -> click on Source -> a new tab opens , in the menu bar of newly opened tab you have option 'Save' , from that option you can save the html code as .html , .txt.
Hope this helps you.

Get code source of dynamically loaded HTML content (Chrome/Gmail)

I am trying to access the HTML code source of AJAX dynamically loaded content. How could I do it?
For example on Gmail, I am trying to access the HTML code of a given email discussion's content (the different entries of a given email discussion) which is loaded only when I click on this email discussion's line in the main list. The code source I can access is only the one of the page initially loaded (the list of all email discussions). Any idea?
Right-click on the page and select "Inspect Element". The element view is updated when JavaScript makes changes to the page, whereas the "View Source" view only shows content from when the page was loaded.
If you right click -> "View Source", it will show you the contents of a reloaded version of the page you are on.
Using "Inspect element" (hotkey CTRL+SHIFT+i) in Chrome shows the source of the dynamic content.
I think you want to bind event on the dom element that loaded after initial page load using ajax. If so then you can use jQuery library and you can use live method of jquery.
Here is a link for live method, you can check that.
http://api.jquery.com/live/
What you need
Download jquery latest library (http://docs.jquery.com/Downloading_jQuery)
and then include it in script within head
or you can use cdn http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js
then do like following
<script>
$(document).ready(function(){
$("#ajax_dom_element_id").live('click_or_any_event',function(){
code snippet you wan dot
});
});
</script>
I think it will be helpfull.

html dynamic change - how view changed contents?

Javascript run at page opening or later by user action like clicking a button with javascript attached, can alter the page contents and for instance change the layout in the browser.
Using right-click "View Source" shows the original content, not the changed one.
But how/from where can one retrieve the new, changed page contents?
You could use Firebug to see the live contents of the DOM, or you could use Web Developer's view generated source feature.