我想编辑youtube视频的字体样式我在youtube.com的检查模式中看到，一个带有ytp字幕段的span标签包装了字幕的文本文件。所以我使用下面的代码来捕捉这个元素：
var subtitle=document.getElementsByClassName('ytp-caption-segment');
但是它总是返回undefined，所以我不能获得它的其他属性？我能做什么？我认为原因是字幕在视频开始后1秒出现，所以它的可见性或显示可能无关紧要。你知道吗？
span.ytp-caption-segment元素不是视频播放器的持久部分，只有当您看到显示的字幕行时，它才存在于DOM中。当字幕消失时，元素将从DOM中删除，并与下一行字幕一起重新创建。
所以基本上你有两种策略：
1.为.ytp字幕段插入CSS规则
这是最简单的方法，但不幸的是，在这种情况下，这并不能完美地工作，因为Youtube在ytp标题元素中生成了许多内联样式的规则，而这些规则无法从CSS中覆盖。
以下是Youtube使用的内联样式(至少目前是这样(：
display: inline-block;
white-space: pre-wrap;
background: rgba(8, 8, 8, 0.75);
font-size: 20.7556px;
color: rgb(255, 255, 255);
fill: rgb(255, 255, 255);
font-family: "YouTube Noto", Roboto, "Arial Unicode Ms", Arial, Helvetica, Verdana, "PT Sans Caption", sans-serif;
这些主要是您可以在Youtube UI中设置的参数(字幕选项(。
CSS仍然可以以有限的方式使用，这取决于您的目标。例如，如果您想制作更大的字体，可以使用"transform:scale(2(；"而不是字体大小(transform属性不会被内联CSS覆盖(。
2.重写.ytp标题段元素
如果你想要完全控制，你必须从ytp标题段中删除样式属性，或者用你自己的样式重写。这不是琐碎的，我描述了主要步骤：
插入一个隐藏字幕的CSS规则，这样当播放器创建新行时，它就不会立即出现在屏幕上。(这可以通过变换或不透明度规则来完成。(
听听有没有新台词！(使用MutationObserver是首选方式，但100秒的轮询也可以作为一种简单的破解方法。(
当你得到这行时，将它的样式属性重写为你喜欢的样式。
不要忘记从第1点覆盖CSS规则。用于隐藏新行！这很容易，因为无论如何都要重写样式属性。
如果您明确说明要在副标题上更改什么，我可以为此创建一个代码片段。