标签归档：js

demo神马的、javascript、jquery、无聊产物

视频手动载入js

发表回复

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

object标签的例子(同上)

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

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

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

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

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

1
2
3
4
5
6
7
8
 
//一堆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]);}
 

全代码↓

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
 
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='&lt;div class="hideitemzhanwei" style="width:'+getwidth(objarray[i])+'px;height:'+getheight(objarray[i])+'px;">&lt;center>&lt;h2 style=\'color:#fff;\'>为了防止流量计费用户的流量损失&lt;br>此处已被自动屏蔽&lt;/h2>&lt;span style="position:absolute;bottom:2px;right:2px;">点击恢复&lt;/span>&lt;/center>&lt;/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;
}
 

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

html、javascript、神奇的问题

给wordpress加上了个代码显示函数

发表回复

原理：文档加载完成以后运行相关函数修改所有code标签

首先要做一件事，把加载文章的php的一个函数修改一下，阻止其给code标签内自动把\n换行替换成<br>标签（这个问题苦了我好久吖╮(╯3╰)╭），函数名wpautop,此函数位于/wp-includes/formatting.php中,找到这个函数里的

1
$pee = preg_replace_callback('/<(script|style).*?<\/\\1>/s', '_autop_newline_preservation_helper', $pee);

这一行，括号里加上|code,变成这样：

1
$pee = preg_replace_callback('/<(script|style|code).*?<\/\\1>/s', '_autop_newline_preservation_helper', $pee);

【这要怎么理解呢。。应该就算是不进行修改的标签列表吧】
然后一切就都方便了，给onLoad加上自己的code处理函数。
以下是我的code处理函数：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
function&nbsp;tolist(string,&nbsp;width)&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(width&nbsp;==&nbsp;"")&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;width&nbsp;=&nbsp;"auto";
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;codelist&nbsp;=&nbsp;'&lt;div&nbsp;style=\'background-color:#fff;overflow:hidden;width:'&nbsp;+&nbsp;width&nbsp;+&nbsp;';max-width:'&nbsp;+&nbsp;width&nbsp;+&nbsp;';word-wrap:break-word;word-break:break-all;word-wrap:break-all;display:block;margin:0px;font-family:&nbsp;"微软雅黑";\'&nbsp;&gt;&lt;div&nbsp;style="color:#CCCCCC;font-size:13px;background-color:#fff;width:100%;height:20px;font-weight:900;"&gt;Code:&lt;/div&gt;&lt;ol&nbsp;style="margin:0px;background-color:#E7E7E7;border:1px&nbsp;solid&nbsp;#CCCCCC;padding-left:50px;color:#00CC33;"&gt;';
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//string=string.replace(/&/g,"&amp;");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;string&nbsp;=&nbsp;string.replace(/&lt;/g,&nbsp;"&lt;");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;string&nbsp;=&nbsp;string.replace(/&gt;/g,&nbsp;"&gt;");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;string&nbsp;=&nbsp;string.replace(/&nbsp;/g,&nbsp;"&nbsp;");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;string&nbsp;=&nbsp;string.replace(/\'/g,&nbsp;"&apos;");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;string&nbsp;=&nbsp;string.replace(/\"/g,&nbsp;"&quot;");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;string&nbsp;=&nbsp;string.replace(/&lt;br\/&gt;/g,&nbsp;'&lt;span&nbsp;style="color:#999999;"&gt;&lt;br/&gt;&lt;/span&gt;');
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;code&nbsp;=&nbsp;string.split("\n");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;;&nbsp;i++)&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(code[i]&nbsp;==&nbsp;""&nbsp;||&nbsp;code[i]&nbsp;==&nbsp;"&nbsp;")&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;code[i]&nbsp;=&nbsp;null;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;break;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for&nbsp;(var&nbsp;i&nbsp;=&nbsp;code.length;&nbsp;i&nbsp;&gt;&nbsp;0;&nbsp;i--)&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(code[i]&nbsp;==&nbsp;""&nbsp;||&nbsp;code[i]&nbsp;==&nbsp;"&nbsp;")&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;code[i]&nbsp;=&nbsp;null;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;break;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;&lt;&nbsp;code.length;&nbsp;i++)&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(code[i]&nbsp;==&nbsp;null)&nbsp;{}&nbsp;else&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;codelist&nbsp;=&nbsp;codelist&nbsp;+&nbsp;'&lt;li&nbsp;style="font-size:13px;"&gt;&lt;div&nbsp;style="border-left:1px&nbsp;solid&nbsp;#999;display:block;margin-right:0px;background-color:#fff;width:auto;min-width:60px;position:relative;color:#000;"&gt;'&nbsp;+&nbsp;code[i]&nbsp;+&nbsp;'&nbsp;&lt;/div&gt;&lt;/li&gt;';
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;codelist&nbsp;=&nbsp;codelist&nbsp;+&nbsp;'&lt;/ol&gt;&lt;/div&gt;';
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;codelist;
}
function&nbsp;findcodetag()&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;document.getElementsByTagName("code");
}
function&nbsp;changecodetag()&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;a&nbsp;=&nbsp;findcodetag();
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;&lt;&nbsp;a.length;&nbsp;i++)&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;code&nbsp;=&nbsp;a[i].innerHTML;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;a[i].innerHTML&nbsp;=&nbsp;tolist(code);
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
}
 

然后onLoad加上changecodetag()

暂时没做出高亮，而且还有些小小的问题。就先摆在这里了。
另外谁可以告诉我最后总有一个空行是肿么回事捏？
后期可能有改动，文章就不改了，详见源代码。