javascript - 更新 YouTube channel Logo 的 Aria-Label

标签 javascript jquery youtube youtube-api

我正在努力创建客户的网站,以使其易于访问。我们正在从带有 YouTube 视频的 iFrame 中提取视频。视频工作正常,更新了隐藏式字幕等。但是,YouTube channel Logo 上显示的咏叹调标签显示为“照片图像”,不符合可访问性指南。

<a class="ytp-title-channel-logo" target="_blank" data-visual-id="2" href="https://www.youtube.com/channel/lettersandsuch" aria-label="Photo image of " style="background-image: url(&quot;https://filepathforphoto.png&quot;);"></a>

因为它在 iFrame 中,所以我不知道我们是否真的可以用 JS 获取和更改 iFrame。我尝试在 YouTube 帐户中更改 Logo 并更新 channel 名称,但它没有达到 aria-label。

我尝试用 jQuery 更改它,但我认为我做得不对。我在 iFrame 上放置了一个 id 并应用了这个:

$(document).ready(function(){
 var iFrameDOM = $("iframe#frameID").contents();
 iFrameDOM.find('.ytp-title-channel-logo').attr('aria-role', 'something');
})

它在本地没有显示任何错误,但没有应用代码更改。有没有办法更改 YouTube channel Logo 上的咏叹调标签?

最佳答案

无法更改跨域 iframe 的 DOM,因为 Same origin policy即,网络浏览器允许第一网页中包含的脚本访问第二网页中的数据,但前提是两个网页具有相同的来源。因此JavaScript无法读取跨站内容。这样做是为了防止被称为 Cross-site scripting (XSS) 的安全漏洞。 .

YouTube player parameter 中没有此选项但我认为你可以通过 IFrame Player API 解决它

关于javascript - 更新 YouTube channel Logo 的 Aria-Label,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53839010/

相关文章:

javascript - Javascript 可以检测嵌入式 Youtube 视频何时结束吗?

ios - 在移动 Safari 中自动全屏播放的 YouTube 链接

javascript - 我如何在 JavaScript 中获取这个子 html 元素?

javascript - jQuery.each() 如何与关联数组(对象)一起工作?

javascript - 应返回的数字是数组中的第一个或最后一个

jquery - ASP.NET MVC 2 AJAX 与 jQuery

javascript - 如何在全选时选择 JQgrid 中的非隐藏行?

java - 我需要 Java 和 Javascript 的特定正则表达式模式

javascript - 当类添加到主体时,将类添加到另一个元素

javascript - 我们如何从 YouTube iframe 中删除/隐藏下一个和上一个箭头图标?