Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Try this:</p> <p><strong>HTML:</strong></p> <pre><code>&lt;div id="target"&gt;&lt;/div&gt; </code></pre> <p><strong>JavaScript:</strong></p> <pre><code>$(function(){ $( "#target" ).load( "pathToYourFile" ); }); </code></pre> <p>In my example, the div will be filled with the file contents. Take a look here: <a href="http://api.jquery.com/load/" rel="noreferrer">http://api.jquery.com/load/</a></p> <p>The "pathToYourFile" cand be any resource that contains the data you want to be loaded. Take a look at the load method documentation for more information about how to use it.</p> <p><strong>Edit: Other examples to get the value to be manipulated</strong></p> <p><strong>Using $.get() function: <a href="http://api.jquery.com/jQuery.get/" rel="noreferrer">http://api.jquery.com/jQuery.get/</a></strong></p> <pre><code>$(function(){ $.get( "pathToYourFile", function( data ) { var resourceContent = data; // can be a global variable too... // process the content... }); }); </code></pre> <p><strong>Using $.ajax() function: <a href="http://api.jquery.com/jQuery.ajax/" rel="noreferrer">http://api.jquery.com/jQuery.ajax/</a></strong></p> <pre><code>$(function(){ $.ajax({ url: "pathToYourFile", async: false, // asynchronous request? (synchronous requests are discouraged...) cache: false, // with this, you can force the browser to not make cache of the retrieved data dataType: "text", // jQuery will infer this, but you can set explicitly success: function( data, textStatus, jqXHR ) { var resourceContent = data; // can be a global variable too... // process the content... } }); }); </code></pre> <p>It is important to note that:</p> <pre><code>$(function(){ // code... }); </code></pre> <p>Is the same as:</p> <pre><code>$(document).ready(function(){ // code }); </code></pre> <p>And normally you need to use this syntax, since you would want that the DOM is ready to execute your JavaScript code.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload