Home > Software engineering >  Loading only part of site into dom via jquery
Loading only part of site into dom via jquery

Time:01-04

I currently attempt loading a crosssite into the current dom via

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>   
<script type="text/javascript">
{
$(document).ready(function(){
    $("#bitbucketissue").load("https://bitbucket.org/alceawisteria/ostr/issues?status=new&status=open");
});
}
</script>
    <div >
        <div id="bitbucketissue">
        </div>

However I only need the "central" 'issue portion' of the page.

Is there a way to cut that "out" ?

(PS: iframes don't work, bitbucket bars em. And Xframes load forever...)

Load site via jquery into current dom.

Site loads, but I need only the center part of it ...

Applied solution as suggested by David (https://stackoverflow.com/users/328193/david):

https://codepen.io/ryedai1/pen/RwBGbNb

CodePudding user response:

The jQuery load() function allows you to also specify a selector. The example from the documentation is:

$( "#result" ).load( "ajax/test.html #container" );

What this does is specifically select #container in the response DOM and discard the rest. Note of course that the entire response is still received, the rest of the content is just discarded client-side.

So whatever selector you would use in the resulting DOM from your response, simply append that to your URL:

$("#bitbucketissue").load("https://bitbucket.org/alceawisteria/ostr/issues?status=new&status=open #someSelector");
  • Related