如何用jQuery将iframe中YouTube视频的HTTP协议替换为HTTPS？

你的思路方向是对的，但现有代码有几个小细节需要调整，我来帮你梳理下：

现有代码的问题点 #

• 你定义的protocol是普通字符串，.test()是正则表达式专属方法，直接调用会报错
• $('body').find('iframe').attr('src')只能获取页面中第一个iframe的src属性，要是页面有多个视频iframe就处理不到了
• 替换逻辑不够精准，万一URL中间出现"http"字符（虽然YouTube链接一般不会，但严谨性很重要），会出现误替换

修正后的实现方案 #

我们可以用正则精准匹配URL开头的http://，然后遍历所有iframe逐个处理，代码如下：

$(document).ready(function(){
    // 定义匹配开头http协议的正则
    const httpRegex = /^http:\/\//;
    // 遍历所有iframe元素
    $('body iframe').each(function(){
        const currentSrc = $(this).attr('src');
        // 如果当前src存在且匹配http开头
        if (currentSrc && httpRegex.test(currentSrc)) {
            // 替换开头的http://为https://
            const newSrc = currentSrc.replace(httpRegex, 'https://');
            // 把新的src赋值回去
            $(this).attr('src', newSrc);
        }
    });
});

关键细节说明 #

• 用/^http:\/\//正则：^表示匹配字符串开头，确保只替换URL最前面的协议部分，不会影响URL中间的内容
• 用.each()遍历所有iframe：保证页面中所有符合条件的视频都能被处理
• 增加currentSrc存在的判断：避免有些iframe没有src属性时出现报错

如果你想更精准地只处理YouTube的iframe，可以再加个域名判断，比如检查src包含youtube.com或者youtu.be：

$(document).ready(function(){
    const httpRegex = /^http:\/\//;
    $('body iframe').each(function(){
        const currentSrc = $(this).attr('src');
        if (currentSrc && httpRegex.test(currentSrc) && (currentSrc.includes('youtube.com') || currentSrc.includes('youtu.be'))) {
            const newSrc = currentSrc.replace(httpRegex, 'https://');
            $(this).attr('src', newSrc);
        }
    });
});

这样就能完美实现把iframe里的YouTube视频链接从HTTP转成HTTPS啦！

内容的提问来源于stack exchange，提问作者Dolarpami Pami