在網頁的開發過程中，有時需要實現一個功能，即在跳轉頁面時使頁面中特定的部分呈現選項卡的形式。這種效果可以通過jquery實現，代碼如下：

$(function(){
$('ul.tabs li').click(function(){
var tab_id = $(this).attr('data-tab');
$('ul.tabs li').removeClass('current');
$('.tab-content').removeClass('current');
$(this).addClass('current');
$("#"+tab_id).addClass('current');
})
})

上面的代碼運用了jquery的click()方法，它會監聽li元素的鼠標點擊事件，并在事件發生時執行相應的函數。在這個函數中，首先獲取當前點擊的li元素的id（即data-tab屬性），接著移除所有li元素和.tab-content元素的current類（current為選中狀態的類名），最后給當前元素添加current類，使其呈現選中狀態。

這段代碼的前提是，我們需要準備一個包含tab切換組件的html結構，如下：

<ul class="tabs">
<li class="tab-link current" data-tab="tab-1">Tab 1</li>
<li class="tab-link" data-tab="tab-2">Tab 2</li>
<li class="tab-link" data-tab="tab-3">Tab 3</li>
</ul>
<div id="tab-1" class="tab-content current">
<p>這是第一個選項卡的內容</p>
</div>
<div id="tab-2" class="tab-content">
<p>這是第二個選項卡的內容</p>
</div>
<div id="tab-3" class="tab-content">
<p>這是第三個選項卡的內容</p>
</div>

這段代碼包含兩個部分，一個是tab選項卡的導航部分，另一個則是用來顯示內容的選項卡內容部分。其中，每一個li元素都有一個data-tab屬性，它用來指定對應的選項卡內容的id。在選項卡內容部分，我們使用id為tab-x的div元素來分別展示每一個選項卡的內容。

將這段代碼和前面提到的jquery代碼結合起來，就能夠實現一個簡單的跳轉頁面變選項卡的效果了。我們只需要將這些代碼放到一個html頁面中，然后在點擊鏈接后，使用jquery的跳轉函數，如下：

$(location).attr('href', 'tab-page.html#tab-2');

在這個函數中，我們使用了jquery的attr()方法來改變當前頁面的href屬性，實現跳轉到另一個頁面的效果。在新頁面中，再次運用上面的代碼，就能夠呈現選項卡效果了。