让jquery也和swfonject一样插入视频

大家正在做网站SEO时，都会用到swfobject来插入相关的flash的吧，然后再做SEO的内容。

那么如果是视频呢？可以像flash一样插入到网页中吗？

答案当然是可以的，因为我有jquery这样的利器。利用jquery我写了一个简单的扩展，像swfobject一样插入视频。

支持youku 和youtube的视频，支持自定义宽度。

代码如下 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Video   Object</title>
<style media="screen" type="text/css">
#video{
    width:480px;
    height:400px;
    margin:0 auto;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="video.js"></script>
  <script type="text/javascript">
 $(function(){
           $("#video").videobject({id:'XMTQ4NTM5MjYw'});
     });
  </script>
</head>
<body>
<div  id="video">测试代码</div>
</body>
</html>

首先在页面引入jquery在google Libraaries API 上的库文件。然后就是我编写的一个扩展，该扩展的名字叫videobject,首先设置了扩展的默认设置，为了简化复杂的参数列表，jquery建议使用这种简化参数列表的形式，就是选项散列对象，即key/value，利用jquery自带的$.extend()函数合并参数，防止传递null或者 undefined的参数进来，在这里，我设置了flash，id，url，width，height等参数。

flash:需要插入的视频代码，可替换部分内容。

id:视频的id

如优酷的视频查找 id 如

视频地址为http://player.youku.com/player.php/sid/XMTY0NzY4NjI4/v.swf 则

即为id

url:此参数来区分是视频的类型，如优酷为youku，youtube为ytb

width:视频的宽度

height: 视频的高度

然后再声明了一个匿名函数(关于js匿名函数这里有比较好的分析)，声明两个变量分别保存了，youku和youtube的视频通用的url地址，通过视频的id的长度来判断替换不同的视频的类型。然后就根据id来插入不同的对象，最后返回当前的对象，先清空当前的div的内容，然后插入填充好了的对象。

video.js 源代码

/*
 *videoobject version: 2.0 beta
 * 利用jquery 插入视频 支持自定义宽度和高度 支持优酷和youtube视频
 *用法$("div的id").videoobject(' 视频代码','类型代码','宽度','高度');
 *
 *视频代码:如http://player.youku.com /player.php/sid/XMTcwMDMxNTA4/v.swf  XMTcwMDMxNTA4即为视频代码 13位
 *默认视频的  宽度:480  高度:400
 *
 *支持 长地址  默认高度和宽度  支持优酷的自动播放
 *如优酷的视频  查找 id 如
 * 视频地址为http://player.youku.com/player.php/sid/XMTY0NzY4NjI4 /v.swf  则XMTY0NzY4NjI4即为id
 *调用方式:以youku为例
 *$("#video").videobject({id:'XMTY0NzY4NjI4'});
 *$("#video").videobject({id:'XMTY0NzY4NjI4',url:'youku'});
 *
 */
(function($){
        $.fn.videobject = function (callerSettings){
        var settings = $.extend({
            flash:'<object width="mywidth" height="myheight" type="application/x-shockwave-flash" data="myurl" id="youku_player" style="visibility: visible;"><param name="quality" value="high"><param name="allowScriptAccess" value="always"><param name="flashvars" value="playMovie=true&isAutoPlay=true"></object>',
            id:'XMTcwMDMxNTA4',
            url:'youku',
            width:'480',
            height:'400'
        },callerSettings||{});
        var showvideo = function(uri){
            var yk = 'http://player.youku.com/player.php/sid/myid/v.swf';
            //var yk ='http://static.youku.com/v/swf/qplayer.swf?VideoIDS=myid=&isAutoPlay=true&isShowRelatedVideo=false&embedid=-&showAd=0';
            var ytb ='http://www.youtube.com/v/myid&hl=en_US&fs=1&autoplay=1';
            // urlĳ жΪyouku or youtube
            if(uri.length ==13){settings.id = yk.replace(/myid/,uri);};//youku
            if(uri.length ==11){settings.id = ytb.replace(/myid/,uri);};//youtube
        return uri == 'youku'?settings.flash.replace(/myurl/,settings.id).replace(/mywidth/,settings.width).replace(/myheight/,settings.height):settings.flash.replace(/myurl/,settings.id).replace(/mywidth/,settings.width).replace(/myheight/,settings.height);
        };
return this.empty().html(showvideo(settings.id));
        }
})(jQuery);