Home/ Questions/Q 791421
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-14T21:50:01+00:00

Is there a way to use jQuery.html() and not loose the scripts and styles?

  • 0

Is there a way to use jQuery.html() and not loose the scripts and styles? or any other non-jQuery way?

I’m trying to output the full HTML of the page the user is on. Is this even possible?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    jQuery.html() removes scripts and styles

    That isn’t my experience (see below). In practice, you have to be aware that what you get back by querying the DOM for HTML strings is always going to be the interpreted HTML, not the original, and there will be quirks (for instance, on IE all the HTML tag names are IN UPPER CASE). This is because jQuery’s html function relies on the browser’s innerHTML property, which varies slightly browser to browser. But the demo below includes both style and script tags on Chrome 4, IE7, and Firefox 3.6; I haven’t tried others, but I would expect them to be okay.

    If you want to get the content of externally-linked pages as well as the inline content, you will naturally have to parse the result and follow the src (on scripts), href (on links that have rel = “stylesheet”), etc…

    Demo:

    <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<title>Test Page</title>
<style type='text/css'>
body {
    font-family: sans-serif;
}
</style>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<script type='text/javascript'>
(function() {
    $(document).ready(pageInit);

    function pageInit() {
        $('#btnGo').click(go);
    }

    function go() {
        alert($('html').html());
    }
})();
</script>
</head>
<body>
<input type='button' id='btnGo' value='Go'>
</body>
</html>
    • 0