建站
咨詢
售后
建站咨詢
新聞中心
頁(yè)面內(nèi)Link
我們都知道，URL中有個(gè)hash屬性，用于定位頁(yè)面上某個(gè)id元素，對(duì)于文檔類的文章， 收藏和分享的時(shí)候，可以定位到具體的位置，十分有用。
當(dāng)然我們也可以有一些有趣的使用方法，比如文章的分頁(yè)，使用ajax請(qǐng)求數(shù)據(jù)。比如我們翻頁(yè)到第5頁(yè)，不小心刷新了頁(yè)面，又會(huì)回到默認(rèn)第一頁(yè)。
但是對(duì)于博客園，我們可以看到，每次ajax請(qǐng)求后，URL會(huì)加上#p{number}，如果不小心刷新頁(yè)面，也會(huì)根據(jù)hash值獲取當(dāng)前頁(yè)，然后查詢當(dāng)前頁(yè)的數(shù)據(jù)。
算是個(gè)用戶體驗(yàn)提升吧。
Scroll to Text Fragment
那么，如果我要分享一篇文章給其他人，文章很長(zhǎng)，我只想讓他看其中的某段或者某句，但是文章是第三方平臺(tái)上，排版不一定恰好如我所愿。
于是，我們就有了這樣一個(gè)需求，希望在URL中加上某個(gè)規(guī)則，再打開(kāi)的時(shí)候，會(huì)自動(dòng)滾動(dòng)到我希望的位置。
W3C也在推進(jìn)這個(gè)事情，有的瀏覽器也已經(jīng)支持該特性了。
使用
語(yǔ)法如下：
#:~:text=[prefix-,]textStart[,textEnd][,-suffix]只傳入textStart則只高亮并滾動(dòng)到符合條件的第一個(gè)
比如：https://news.cnblogs.com/n/719980/#:~:text=加速器textStart 和 textEnd同時(shí)傳入可以選中某一段落
https://news.cnblogs.com/n/719980/#:~:text=到目前為止,希望之一prefix 和 suffix主要是限定所選詞的位置
https://news.cnblogs.com/n/719980/#:~:text=進(jìn)入-,暗物質(zhì),-研究
瀏覽器兼容性
Chrome80開(kāi)始支持該特性，其他瀏覽器未測(cè)。
參考
https://wicg.github.io/scroll-to-text-fragment/
https://chromestatus.com/feature/4733392803332096
https://web.dev/text-fragments/
https://stackoverflow.com/questions/62161819/what-exactly-is-the-text-location-hash-in-an-url
網(wǎng)頁(yè)題目：ScrolltoTextFragment-頁(yè)面滾動(dòng)到特定文字片段處-創(chuàng)新互聯(lián)
當(dāng)前URL：http://fisionsoft.com.cn/article/dshcgc.html
