When you click a button that loads or submits information without leaving the page, JavaScript can send an HTTP request with the browser’s Fetch API. The browser routes that request to a service, the service processes it and returns an HTTP response, and the page code interprets the result to update the interface or show an error.
1. The click starts page code
A button’s event handler responds to the click. It may call JavaScript’s Fetch API to retrieve information or submit data while the current page remains open. Fetch is asynchronous: it returns a promise, so the page can continue running while the request is in progress. This differs from a full-page navigation, which asks the browser to load another document.
As an Amazon Associate I earn from qualifying purchases.
For a high-level overview of the browser’s role in a web request, see MDN’s explanation of how the web works. Fetch’s request and response handling is described in MDN’s guide to making network requests with JavaScript.
2. The browser prepares a network route
To contact a service by hostname, the browser needs its network address, commonly obtained through DNS. It also needs a transport connection. For HTTPS, TLS negotiation helps protect the connection and verify the server. These steps sit below HTTP: HTTP defines the request-and-response messages, while DNS, transport connections and TLS help get those messages to and from the service.
#1 Best Overall
This sequence does not necessarily start from scratch for every click. A browser can reuse a suitable connection, so a request may not require a new DNS lookup, connection handshake and TLS negotiation each time. MDN describes the layers and connection reuse in its overview of HTTP and explains browser connection setup in how browsers work.
3. The browser sends an HTTP request
The request tells the service what operation is being requested and which resource is its target. It can also carry headers, such as information about the content the client accepts or authorization context. Some requests, commonly POST requests, include a body with data from the page. The exact method, path, headers and body depend on the action and the API.
4. The request may pass through intermediaries
A proxy or cache can sit between the browser and the service handling the request. A service that appears to the user as one destination may be backed by several servers or supporting systems. The route and architecture vary by service, so “the browser talks to one server” is a useful simplification, not a guarantee about what happens in every deployment. MDN’s HTTP overview discusses intermediaries, while its guide to client-side storage describes browser-side storage rather than a universal server design; architecture details remain service-specific.
Do these 3 things before closing this tab:
1Repair Windows errors before they cause bigger problems2Scan for outdated or missing drivers - takes under a minute3Clear out junk files and repair common Windows errors5. The service handles the request
The application applies its own logic to decide what the request means and what to return. It may consult other systems, but not every API call necessarily reads a database: some responses can be produced through other kinds of processing. The implementation behind a service is specific to that service.
Rank #3
6. The service returns an HTTP response
An HTTP response contains a status code and headers, and may include a body. A status such as 200 indicates success at the HTTP level; other statuses can communicate outcomes such as a missing or forbidden resource. The response returns over the connection, passing through any intermediaries on the route. The response structure and status codes are covered in MDN’s HTTP overview.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.7. Page code interprets the result
Receiving a response is not the same as deciding that the action succeeded. Fetch code should inspect the response status or its ok property, parse a body if needed—for example, with response.json()—and then update the page. It should also handle network failures and unsuccessful HTTP statuses. A fulfilled Fetch promise alone does not prove that the HTTP response indicates success; MDN explains this distinction in its Fetch guide.
That is how a click becomes a visible result: page code initiates the request, the browser and network deliver it, the service responds, and the page decides what to show.
Quick wins for a faster PC:
Clear out junk files and repair common Windows errorsFree Scan →Scan for outdated or missing drivers - takes under a minuteDriver Scan →Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
