[whatwg] <a onlyreplace>

[Markus Ernst]

Tab Atkins Jr. schrieb:
[...]

>> The body of page1.html could look like:
>>
>> <div id="pageHeader">Recipies for vegetarians</div>
>> <div id="content">
>>  <h1>Lovely broccoli</h1>
>>  <p>Take the broccoli and do the following:</p>
>>  ...
>> </div>
>> <ul id="navigation">
>>  <li><span>Broccoli</span></li>
>>  <li><a href="page2.html" onlyreplace="content">Leak</a></li>
>> </ul>
>>
>> The body of page2.html:
>>
>> <div id="pageHeader">Recipies for meat eaters</div>
>> <div id="content">
>>  <h1>Lovely leak</h1>
>>  <p>Take the leak and do the following:</p>
>>  ...
>> </div>
>> <ul id="navigation">
>>  <li><a href="page1.html" onlyreplace="content">Broccoli</a></li>
>>  <li><span>Leak</span></li>
>> </ul>

[...]

> (Also, in your examples you probably want @onlyreplace="content
> navigation", since your nav is changing from page to page as well.

Indeed. Or, maybe I'd do it slightly differently, somehow like:

<ul id="navigation">
   <li><a href="page1.html" onlyreplace="content" class="thisPage"
     onClick="resetNavigation(this)">Broccoli</a></li>
   <li><a href="page2.html" onlyreplace="content"
     onClick="resetNavigation(this)">Leak</a></li>
</ul>

The resetNavigation() function then takes the class attribute from the 
old link and adds it to the clicked one. So the navigation can be 
static, and though its appearance remains consistent, whether page2.html 
is completely loaded, or only the parts defined in @onlyreplace.