How to read external html file and store it to string variable using jQuery? Showing Error

Question

I am trying to Dynamically Generating the Codes for Web Application
I Want to read External HTML File and store it to string variable in Javascript or Jquery ?
Is there any efficient way for this..?

HTML File - Object-text.html

<div class="text-object">
    <div class='text-area'>
        <span class='content'>
            <span class='title'> title</span><br/>
            <span class='address'>  address  </span>
        </span>
    </div>
    <div class='patch'></div>
</div>
<br class='float-clear'/>

JQUERY

$(document).ready(function()
{
  $.get("templates/object-text.html", function(html_string)
   {
      alert(html_string);  // this is not Working
   });
});

Showing Error in Console

Junk After Docuement Element

awaiting responses.
Thanks in Advance

Possible duplicate of How do I load html into a variable with jquery — fernando
– fernando, Commented Aug 20, 2016 at 7:38
@mariusz thank you my purpose similarly same as you shared, but its doesn't works — Keerthivasan
– Keerthivasan, Commented Aug 20, 2016 at 7:55
Are the contents of the HTML file okay? Can you check the Network tab in the developer tools and inspect the Response tab of the XHR request to see if the file isn't mangled? Assuming Junk after document element is the error message you are getting, maybe XHR isn't the issue here, instead jQuery maybe tries parsing XML and fails? Check api.jquery.com/jquery.get dataType default is intelligent guess, try setting it to string. — Tomáš Hübelbauer
– Tomáš Hübelbauer, Commented Aug 20, 2016 at 8:32

Keerthivasan · Accepted Answer · 2016-08-20 09:10:44Z

11

Changed JQUERY Code

i've added the extra arguement to the function call $.get() to specify the html content

$(document).ready(function()
{
  $.get("templates/object-text.html", function(html_string)
   {
      alert(html_string); 
   },'html');    // this is the change now its working
});

answered Aug 20, 2016 at 9:10

Keerthivasan

1,6611 gold badge22 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Melisa Over a year ago

Today 3 Dec 2022 and it works. you saved me a big trobule.

Amit Kumar Pawar · Accepted Answer · 2016-08-20 08:41:24Z

1

this verion is working fine for me you have to close `);` 
$(document).ready(function()
    {
      $.get("leads/leads_custom_box.php", function(result)
       {
          alert(result);
       });
    });

answered Aug 20, 2016 at 8:41

Amit Kumar Pawar

3,3301 gold badge22 silver badges27 bronze badges

8 Comments

Amit Kumar Pawar Over a year ago

just add a closing bracket for $.get( ); it will work

Keerthivasan Over a year ago

What you getting the output..? HTML Code or what else..?

Keerthivasan Over a year ago

i already closed that in my local file.. i am getting object XMLDocument

Amit Kumar Pawar Over a year ago

what is in your file you want to include what content it posses

Amit Kumar Pawar Over a year ago

$(document).ready(function() { $.get("templates/epc-object-text.html", function(result) { alert(result); }); });

|

NAGESWARA RAO GUNDA · Accepted Answer · 2020-07-07 07:10:58Z

1

using jquery

$.get("http://localhost/something/something.html", function (result) {
     html = result;
     text = $(result).text();
});

answered Jul 7, 2020 at 7:10

NAGESWARA RAO GUNDA

113 bronze badges

Collectives™ on Stack Overflow

How to read external html file and store it to string variable using jQuery? Showing Error

3 Answers 3

1 Comment

8 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

8 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related