为什么这个jQuery脚本不把HTML页面上的视频声明替换为GIF声明?

Why isn't this jQuery script replacing the video declaration with the GIF declaration on an HTML page

本文关键字：声明 的视频 替换 GIF jQuery 脚本 HTML 为什么      更新时间：2023-09-26

我正在编写一个jQuery脚本来检测访问我的网站的用户是在iOS设备上，当他们是，将网站的背景从视频切换到GIF，因为。mp4和。webm文件不支持iOS版本的Safari。该脚本使用modernizr.js和uissearch .js作为支持文件。该脚本直接包含在HTML中，而不是作为单独的文件。

$(document).ready(function() {
    if((navigator.userAgent.match(/iPhone/i)) || 
      (navigator.userAgent.match(/iPod/i)) ||
      (navigator.userAgent.match(/iPad/i))) {
      ('.video-background').remove();
      ('body').prepend('<img src="./index_files/Test_cut_GIF.gif" id="backgroundimage" class="video-background">');
    }
  });

它试图改变的HTML看起来像这样:

<body  div="main" class="html front not-logged-in no-sidebars page-node page-node- page-node-16 node-type-panel role-1 lightbox-processed">
  <div class="video-background">
    <video id="video" preload="none" poster="./index_files" autoplay="autoplay" loop="true">
      <source src="./index_files/Test_cut_soundless_WEBM.webm" type="video/webm">
      <source src="./index_files/Test_cut_soundless_MP4.mp4" type="video/mp4">
    </video>
  </div>

它试图将其更改为:

<body  div="main" class="html front not-logged-in no-sidebars page-node page-node- page-node-16 node-type-panel role-1 lightbox-processed">
  <img src="./index_files/Test_cut_GIF.gif" id="backgroundimage" class="video-background">

我是一个非常初级的程序员，如果有人能告诉我这里不工作的地方，那将非常感激!

在调用remove和preend时，您在开始处丢失了$

: 

('.video-background').remove();
('body').prepend('<img src="./index_files/Test_cut_GIF.gif" id="backgroundimage" class="video-background">');

替换为:

$('.video-background').remove();
$('body').prepend('<img src="./index_files/Test_cut_GIF.gif" id="backgroundimage" class="video-background">');

我希望这对你有帮助。

相关文章：