background preloader

PushState en Javascript

Facebook Twitter

URI Parsing with Javascript. ParseUri 1.2: Split URLs in JavaScript. Thursday, June 28th, 2007 • Related • Filed Under I've just updated parseUri.

parseUri 1.2: Split URLs in JavaScript

If you haven't seen the older version, parseUri is a function which splits any well-formed URI into its parts, all of which are optional. Its combination of accuracy, flexibility, and brevity is unrivaled. Highlights: Comprehensively splits URIs, including splitting the query string into key/value pairs. Try the demo, but make sure to come back and read the details below. Details: Older versions of this function used what's now called loose parsing mode (which is still the default in this version). Since I've assumed that most developers will consistently want to use one mode or the other, the parsing mode is not specified as an argument when running parseUri, but rather as a property of the parseUri function itself. ParseUri.options.strictMode = true; From that point forward, parseUri will work in strict mode (until you turn it back off).

The code: ParseUri: Split URLs in JavaScript. Jsuri - Fluent javascript uri/url parsing and manipulation. jQuery BBQ: Back Button & Query Library. jQuery BBQ leverages the HTML5 hashchange event to allow simple, yet powerful bookmarkable #hash history.

jQuery BBQ: Back Button & Query Library

In addition, jQuery BBQ provides a full .deparam() method, along with both hash state management, and fragment / query string parse and merge utility methods. This plugin and the jQuery urlInternal plugin supersede the URL Utils plugin. Note: If you’re using jQuery 1.3.2 or earlier and need BBQ to merge query string or fragment params containing [], you’ll want to include the jQuery 1.4 .param method in your code. Also, my article Cooking BBQ: the original recipe gives a history of jQuery BBQ along with some plugin authoring guidelines, if you’re interested. What jQuery BBQ allows you to do: While this brief overview will give you the broad strokes, for specifics you should look at the the basic examples below, read the documentation, and check out the full examples listed above. jQuery BBQ community Have you used jQuery BBQ in an project, website, article or tutorial?

History API — Warpspire Experiments. URL Design — Warpspire. December 28, 2010 You should take time to design your URL structure.

URL Design — Warpspire

If there’s one thing I hope you remember after reading this article it’s to take time to design your URL structure. Don’t leave it up to your framework. Don’t leave it up to chance. Think about it and craft an experience. URL Design is a complex subject. But that doesn’t mean there aren’t best practices for creating great URLs. Why you need to be designing your URLs The URL bar has become a main attraction of modern browsers. URLs are universal. Any regular semi-technical user of your site should be able to navigate 90% of your app based off memory of the URL structure. Top level sections are gold The most valuable aspect of any URL is what lies at the top level section. Do I seem dramatic? Another quick tip — whenever you’re building a new site, think about blacklisting a set of vanity URLs (and maybe learn a little bit about bad URL design from Quora’s URLs).

Namespacing is a great tool to expand URLs A great example. Can.route push state? - JavaScriptMVC Forum. Ok.

can.route push state? - JavaScriptMVC Forum

Can you confirm that when using the pushstate plugin, links will not use the hash/hashbang as demonstrated in the above post? Here's what I have/am thinking so far: When a link is clicked, we trap it and look for a matching route. To do this, we pass we the new can.route.updateWith(href). But what do we pass to updateWith? It seems that $(this).attr("href") is the best candidate as it contains just the new part of the href that the link is trying to navigate to.

Copy code $(document).on('click', 'a', function(e) { if(! This.href, which you reference in your example contains the whole link. You talk about operating on location.pathname, but that value is not updated until after pushState is called, which will be called only after an updateWith call response of true. Once in updateWith, should I be doing this using can.route.deparam? Anyway, trying to make progress. Manipulating the browser history. The DOM window object provides access to the browser's history through the history object.

Manipulating the browser history

It exposes useful methods and properties that let you move back and forth through the user's history, as well as -- starting with HTML5 -- manipulate the contents of the history stack. Traveling through history Moving backward and forward through the user's history is done using the back(), forward(), and go() methods. Moving forward and backward To move backward through history, just do: History API. You are here: Home Dive Into HTML5 Diving In The browser location bar is perhaps the geekiest mainstream piece of user interface in the world.

History API

There are URLs on billboards, on the sides of trains, and even in street graffiti.