视频手动载入js

俺花了好长时间,用我这不熟练的技术好不容易做了个带满缺点的js
那么这货的用处就是屏蔽掉flash这样的东西【当然如果修改一下js可以屏蔽掉body里的任何标签
先来个示例【有视频有真相
embed标签的例子(无视频源)video标签的例子(同上)

其实屏蔽了以后看起来都是一样的。。

这货的功能:点击以后再载入,防止意外流量损失或带宽?占用
这就是个鲜明的例子181
里面装满了视频,这样就可以解决打开这个网页一下载入很多视频的问题了

原理:让div插队再干掉背后的原标签并给这个div添加可以给自己内部写入被杀掉标签的事件↓

objarray[i].parentNode.insertBefore(tmpdiv,objarray[i]);//插队到原标签前面
objarray[i].parentNode.removeChild(objarray[i]);//干掉原标签

特点:插队的div使用源元素的宽高和定位【本来想把z-index也算进去的,时间不够就不做了↓

//一堆if用来判断是否有这些属性
if(getwidth(objarray[i])){tmpdiv.style.width=getwidth(objarray[i]);}
if(getheight(objarray[i])){tmpdiv.style.height=getheight(objarray[i]);}
if(getposition(objarray[i])){tmpdiv.style.position=getposition(objarray[i]);}
if(getright(objarray[i])){tmpdiv.style.right=getright(objarray[i]);}
if(getleft(objarray[i])){tmpdiv.style.left=getleft(objarray[i]);}

全代码↓

var changevideos=function(){
var target=new Object;
function findtag(tag) {
return document.getElementsByTagName(tag);
}
function getwidth(obj){
if(obj.width){return obj.width;}else if(obj.style.width){return obj.style.width;}else{return false;}
}
function getheight(obj){
if(obj.height){return obj.height;}else if(obj.style.height){return obj.style.height;}else{return false;}
}
function getposition(obj){
return obj.style.position?obj.style.position:false;
}
function getright(obj){
return obj.style.right?obj.style.right: false;
}
function getleft(obj){
return obj.style.left?obj.style.left:false;
}
function changeinner(html){
target=event.srcElement?event.srcElement:event.target;
target.innerHTML=html;
}
function run(objarray){
for (var i = 0; i < objarray.length; i++) { var aimhtml = objarray[i].outerHTML; var tmpdiv=document.createElement("div"); if(getwidth(objarray[i])){tmpdiv.style.width=getwidth(objarray[i]);} if(getheight(objarray[i])){tmpdiv.style.height=getheight(objarray[i]);} if(getposition(objarray[i])){tmpdiv.style.position=getposition(objarray[i]);} if(getright(objarray[i])){tmpdiv.style.right=getright(objarray[i]);} if(getleft(objarray[i])){tmpdiv.style.left=getleft(objarray[i]);} tmpdiv.innerHTML='<div class="hideitemzhanwei" style="width:'+getwidth(objarray[i])+'px;height:'+getheight(objarray[i])+'px;"><center><h2 style=\'color:#fff;\'>为了防止流量计费用户的流量损失<br>此处已被自动屏蔽</h2><span style="position:absolute;bottom:2px;right:2px;">点击恢复</span></center></div>';//填上填充显示的内容
//tmpdiv.style.overflow="hidden";
tmpdiv.setAttribute('onClick','changevideos.changeinner(\''+aimhtml+'\')');
tmpdiv.style.display="inline-block";
objarray[i].parentNode.insertBefore(tmpdiv,objarray[i]);
objarray[i].parentNode.removeChild(objarray[i]);
}
}
function changehideneededtag() {
var tmpstyle=document.createElement("style");
tmpstyle.innerHTML=".hideitemzhanwei{position:relative;background-color:#66ccff;color:#fff;cursor:pointer;}";
document.getElementsByTagName("head")[0].appendChild(tmpstyle);
var a;
if(a=findtag("embed")){
run(a);}
if(a=findtag("object")){
run(a);}
if(a=findtag("video")){
run(a);}
}
changehideneededtag();
}
changevideos.changeinner=function(html){
target=event.srcElement?event.srcElement:event.target;
target.innerHTML=html;
}

没时间了所以还有些可能出错的地方没做错误处理,以后来补上



本文发布于 https://luojia.me

本站文章未经文下加注授权不得拷贝发布。

本博客使用Disqus评论系统,如果看不到评论框,请尝试爬墙。