在网站中嵌入 YouTube 视频是非常常见的前端开发需求，但是默认情况下，视频播放器会带有 YouTube 的品牌标识，这可能对一些网站来说并不理想。本文将介绍如何去除嵌入的 YouTube 视频品牌标识。
方法 1：使用参数 rel=0
在嵌入代码中添加参数 rel=0 可以禁用相关视频列表和品牌标识。例如：
<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID?rel=0" frameborder="0" allowfullscreen></iframe>
方法 2：自定义样式
通过自定义 CSS 样式，可以在页面中隐藏品牌标识。首先需要查找品牌标识所在的元素，并将其隐藏。例如：
/* 隐藏品牌标识 */ .ytp-watermark { display: none !important; }
同时，也可以修改播放器的颜色方案，使其与网站风格相符。例如：
/* 修改播放器颜色方案 */ .ytp-progress-bar-container { background-color: #FF0000; } .ytp-play-progress { background-color: #FFFFFF; }
方法 3：使用 JavaScript API
YouTube 提供了 JavaScript API，可以在嵌入的播放器上执行许多操作，如控制播放、音量和视频质量等。使用这个 API，我们可以在加载完毕后隐藏品牌标识。例如：
-- -------------------- ---- ------- ---- ------------------ -------- -- - --- -------------- --- ------- -------- ------------------------- - ------ - --- ------------------- - -------- ----------- ----------- - ------ - - --- ---------------------------------- --------------- - --------------------------------------------------------------------- --- - --------- ---- ---- --- -- --- ------- --------------------------------------------------展开代码
在上面的示例中，我们加载了 YouTube 的 JavaScript API，并在 onReady 事件中执行了 setLogoVisibility 方法来隐藏品牌标识。
总结
以上是去除嵌入的 YouTube 视频品牌标识的三种方法：使用参数 rel=0、自定义样式和使用 JavaScript API。每种方法都有其优劣之处，需要根据具体情况选择最合适的方式。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/28842
