javascript - Dynamically loading HTML and CSS data from another page -


i trying dynamically load html , css data page in website project.

suppose have 2 pages. first 1 onepage.html , second 1 twopage.html. have html , css (css in external sheet) data in twopage.html feed onepage.html.

suppose have structure twopage.html in snippet below:

@import url('http://getbootstrap.com/dist/css/bootstrap.css');    .col-sm-3{    background-color: green;    height: 100px;    color: white;  }
<div class="container">    <div class="row">       <div class="col-sm-3">         <p>hello</p>       </div>       <div class="col-sm-3">         <p>hello</p>       </div>       <div class="col-sm-3">         <p>hello</p>       </div>       <div class="col-sm-3">         <p>hello</p>       </div>    </div>  </div>

now data in twopage.html dynamic, meaning add set of new divs (in case of example, .col-sm-3) replaces old ones in row class. effect similar appending.

i load inside row class onepage.html (with accompanying css). how that? task javascript have no idea starting point here. methods use? program backend using node.js , express.js (if comes in handy figuring out solution).

don't know if got right... can use jquery , load second file (on same server) via $.get

in onepage.html example:

<script>          $(function () {              $.get("twopage.html", function (data) {                 $('.result').html($(data).find('.row').html());             });          });  </script> 

and div.result element in body paste filtered data:

<div class="result"></div> 

Comments

Popular posts from this blog

neo4j - finding mutual friends in a cypher statement starting with three or more persons -

php - How to remove letter in front of the word laravel -

minify - Minimizing css files -