對于一些需要等待加載的頁面，往往需要使用遮罩層來提示用戶正在加載中，以提高用戶體驗。使用jquery實現遮罩層，可以輕松實現這一功能。

首先，我們需要在頁面引入jquery庫文件：

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

接著，定義一個遮罩層的樣式：

.mask{
position: fixed;
top: 0;
left: 0;
z-index: 999;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: none;
}
.loading{
position: fixed;
top: 50%;
left: 50%;
z-index: 1000;
transform: translate(-50%,-50%);
background-image: url(loading.gif);
background-position: center;
background-repeat: no-repeat;
width: 50px;
height: 50px;
text-align: center;
display: none;
}

其中，mask類為遮罩層的樣式，loading類為加載圖標的樣式。

然后，在頁面中定義需要使用遮罩層的元素，并在該元素內部添加遮罩層和加載圖標：

<div id="wrapper">
<div class="mask"></div>
<div class="loading"></div>
//頁面內容
</div>

接下來，使用jquery實現遮罩層的顯示和隱藏：

<script>
$(document).ready(function(){
$('#wrapper').on('click', function(){
$('.mask').show();
$('.loading').show();
//模擬加載延遲
setTimeout(function(){
$('.mask').hide();
$('.loading').hide();
}, 3000);
})
})
</script>

在上述代碼中，當用戶點擊#wrapper元素時，遮罩層和加載圖標同時顯示，模擬一個3秒鐘的加載過程后，遮罩層和加載圖標同時隱藏。

這樣，我們就成功地實現了jquery遮罩層加載中的功能，使頁面看起來更加專業和友好。