我最近有蒐集不少問題 這是其中之一 比較小的項目
我的主要疑問是
YT的字幕其實是不斷重新誕生新的span 所以我抓到他的span改了樣式後 下一個又等於跳回去 勢必我必須要setinterval不斷的去馬上改成我要的字體 不過經由測試 就算是50的毫秒也是有發現從原字體變成新字體的更動 視覺上會很不舒服
目前我在想 有兩種解法 第一個是用我不知道的方法 想辦法改 第二是退而求其次 我直接不開字幕 然後直接重新把字幕加回去
難道只能用第二種招式了嗎
若如此 我也有想到延伸的問題 也就是說
1.豈不是必須先下載字幕 那麼似乎會必須有等待時間 2.添加字幕如果用html原生的方法不知是否可行 又者要自己寫一個針對撥放秒數判斷字幕的 那難度似乎又是另一個等級
按讚的人：
共有 4 則留言
文字內容提供幾種功能：
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式
按讚的人：
$('style').append($('<div>').innerHTML=`<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&display=swap" rel="stylesheet">`)
setInterval(function(){document.querySelector(".caption-visual-line").children[0].style.fontFamily="Ma Shan Zheng"},50)
測試影片:https://www.youtube.com/watch?v=5HWYEjuxLtE&t=736s
可以看到每次換字幕會有一點縮放的改動 仔細看的話會不太舒服
按讚的人：
我測試了一下了，因為是 setInterval，所以確實會跳動
試試看這段，效果更好一點
$('style').append($('<div>').innerHTML=`<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&display=swap" rel="stylesheet">
<style>span.ytp-caption-segment { font-family: Ma Shan Zheng !important; }</style>`)
應該可以繼續優化
你再往這方向試試看？
按讚的人：
我剛試了一下，看看我這張截圖
在
span.ytp-caption-segment上面，使用 css 時加上!important強制覆蓋呢？如何？我測試好像就可以喔～