How do they do it? Dynamic Loading pages/websites ... Framework, script? PHP, jQuery, Ruby?

Asked
Active3 hr before
Viewed126 times

6 Answers

loadingdynamic
90%

Question answered already: Change browser URL and page content without reload and without using fragments,So I'm sure a bunch of you have seen or even use sites that load pages seemingly dynamically, without ever actually changing pages. As well as changing the url in the address bar., Stack Overflow for Teams Where developers & technologists share private knowledge with coworkers ,as you can see, when either of the two script file is loaded the must be unload, if so, the rendered view will change dynamically depending on the loaded script.

This is my idea;

 var href = window.location.href;

This will get the whole href from the address bar.

href = href.split("#/");

this can also bee # to split from an has tag

item = href[1].split("/");

this can be anything you like to use to split each paremeter item.

lastitem = item[item.length - 1]

When the document is ready I check what the last item in the parameter (after /) is. I then have a php file with the same name, I find it and add it the the content area.

$.ajax({
   url: lastitem '.php',
   success: function(data) {
      $('.content').html(data);
   }
});

The click event can than be like this

$("a").click(function() {

   var href = $(this).attr(href);
   href = href.split(# / );
   href = href[href.length - 1];

   $.ajax({
      url: href '.php',
      success: function(data) {
         $('.content').html(data);
      }

   });

});
load more v
88%

scripts with a defer attribute will load in the order they are in and will only execute once everything has finished loading.,In this case both the script and the HTML will load simultaneously and the code will work.,For example, if you have the following script elements:,You can try this version of our demo below.

<p>Player 1: Chris</p>
load more v
72%

A single-page application (SPA) is a web application or website that interacts with the user by dynamically rewriting the current web page with new data from the web server, instead of the default method of a web browser loading entire new pages. The goal is faster transitions that make the website feel more like a native app. ,The SPA approach on the web is similar to the single-document interface (SDI) presentation technique popular in native desktop applications. ,There are various techniques available that enable the browser to retain a single page even when the application requires server communication. ,Analytics tools such as Google Analytics rely heavily upon entire new pages loading in the browser, initiated by a new page load. SPAs do not work this way.

Because of the lack of JavaScript execution on crawlers of some popular Web search engines,[17] SEO (Search engine optimization) has historically presented a problem for public facing websites wishing to adopt the SPA model.[18]

Between 2009 and 2015, Google Webmaster Central proposed and then recommended an "AJAX crawling scheme"[19][20] using an initial exclamation mark in fragment identifiers for stateful AJAX pages (#!). Special behavior must be implemented by the SPA site to allow extraction of relevant metadata by the search engine's crawler. For search engines that do not support this URL hash scheme, the hashed URLs of the SPA remain invisible. These "hash-bang" URIs have been considered problematic by a number of writers including Jeni Tennison at the W3C because they make pages inaccessible to those who do not have JavaScript activated in their browser. They also break HTTP referer headers as browsers are not allowed to send the fragment identifier in the Referer header.[21] In 2015, Google deprecated their hash-bang AJAX crawling proposal.[22]

#!
65%

How a front-end framework might help address these. ,We’re going to talk about front-end frameworks a bunch (you might have gotten a hint from the title), so let’s get on the same page around terminology:,Let’s recap the major ways in which adopting a front-end framework will help our quickly growing app:,What would MySquare look like if you implemented a popular front-end framework, like React? Here are a few changes you would experience:

load more v
75%

express - Express.js—or simply Express—a Sinatra-inspired web development framework for Node.js, and the de-facto standard for the majority of Node.js applications out there today.,hapi - a very modular and simple to use configuration-centric framework for building web and services applications,Node.js executes JavaScript code in its environment on the server, whereas Angular is a JavaScript framework that gets executed on the client (i.e. within a web browser.),pug (formerly Jade) - One of the popular templating engines, inspired by HAML, a default in Express.js.

40%

jQuery Learning Center,jQuery Core API Documentation,Browse or Submit jQuery Bugs

$("button.continue").html("Next Step...")
load more v

Other "loading-dynamic" queries related to "How do they do it? Dynamic Loading pages/websites ... Framework, script? PHP, jQuery, Ruby?"