分类 reprint 下的文章

来自 http://www.xhily.cn/archives/104.html
它可以在当前网页上生成一个小飞机,你能用方向键控制移动方向(还有漂移效果,感觉很好),空格键发射子弹(有爆炸效果,子弹能穿越屏幕),目的就是消除网页上的任意HTML 元素,右下角有得分统计。

玩到中途时可用Esc 退出游戏,并且而且,退出后,网页上残留的元素依然能正常使用(长按字母 B 查看),所以在某些情况下也能用来恶搞。

boom
我知道不上图你们是不会相信的

点我

代码必须分享出来吧

页面调用代码

javascript:var s = document.createElement('script');s.type='text/javascript';document.body.appendChild(s);s.src=' https://m69w.com/demo/fj.js ';void(0);

也可以使用浏览器自带的功能实现 比如Google的Console 国产浏览器的控制台 将以上代码输进去 敲回车 依然可以

提问的智慧
提问的智慧(How To Ask Questions The Smart Way)一文最早是由Eric Steven Raymond所撰写,说明了作者所认为一位发问者事前应该要做好什么,而什么又是不该做的。作者认为这样能让问题容易令人理解,而且发问者自己也能学到较多东西。

此文在网络上受到欢迎,被广泛转载而广为人知甚至奉为经典。该文也有简体中文与繁体中文的翻译版本被流传着,所以在华人界也是很有名的文章。著名的两个缩写STFW(Search the fxxking web)以及RTFM(Read the fxxking manual)就是出自本文。

有些人认为文中部分用词对新手不太友善,所以作者后来也在新版中做了较委婉的修饰。目前作者仍持续进行更新本文,最近一次更新是2013年4月23日。--来自 维基百科
英文版 http://www.catb.org/~esr/faqs/smart-questions.html
中文版 http://doc.zengrong.net/smart-questions/cn.html

GitHub https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way
GitHub中文版 https://github.com/FredWe/How-To-Ask-Questions-The-Smart-Way/blob/master/README-zh_CN.md
衍生版:
图说:提问的智慧
提问的智慧
如何成为一名黑客
smart_questions
提問的智慧繁体版

你尽力了吗?
文章作者:SCZ
信息来源:邪恶八进制信息安全团队(www.eviloctal.com
很多人问如何入门如何入门,我却不知道要问的是入什么门。很少把某些好文章耐心从头看完,我这次就深有体会。比如袁哥的sniffer原理,一直以为自己对sniffer原理很清楚的,所以也就不曾仔细看过袁哥的这篇。后来有天晚上和袁哥讨论,如何通过端口读写直接获取mac地址,为什么antisniff可以获得真正的mac地址,而不受更改mac地址技术的影响,如何在linux下获得真正的mac地址。我一直对linux下的端口读写心存疑虑,总觉得在保护模式下的端口都做了内存映象等等。结果袁哥问了我一句,你仔细看我写的文章没有,我愣,最近因为要印刷月刊,我整理以前的很多文档,被迫认真过滤它们,才发现袁哥的文章让我又有新认识。再后来整理到tt的几篇缓冲区溢出的,尤其是上面的关于Solaris可装载内核模块,那就更觉得惭愧了。
以前说书非借不能读,现在是文章留在硬盘上却不读。其实本版已经很多经典文章了,也推荐了不少经典书籍了,有几个好好看过呢。W.Richard.Stevens的UNP我算是认真看过加了不少旁注,APUE就没有那么认真了,而卷II的一半认真看过,写过读书笔记,卷III就没有看一页。道格拉斯的卷I、卷III是认真看过几遍,卷II就只断续看过。而很多技术文章,如果搞到手了就懒得再看,却不知道这浪费了多少资源,忽略了多少资源。BBS是真正能学到东西的地方吗?rain说不是的,我说也不是的。不过这里能开阔人的视野,能得到对大方向的指引,足够了。我一直都希望大家从这里学到的不是技术本身,而是学习方法和一种不再狂热的淡然。很多技术,明天就会过时,如果你掌握的是学习方法,那你还有下一个机会,如果你掌握的仅仅是这个技术本身,你就没有机会了。其实我对系统安全是真不懂,因为我一直都喜欢看程序写程序却不喜欢也没有能力攻击谁谁的主机/站点。
我所能在这里做的是,为大家提供一个方向,一种让你的狂热归于淡然的说教。如果你连看都没有看过,却要写个什么隐藏自己的木马,搞笑。如果你看都不看汇编语言,偏要问exploit code的原理,那我无法回答也不想回答你。总有人责问,要讨个说法云云,说什么提问却没有回答。不回答已经是正确的处理方式了,至少没有回你一句,看书去,对不对,至少没有扰乱版面让你生闷气。Unix的man手册你要都看完了,想不会Unix都不行了。微软的MSDN、Platform SDK DOC你要看完了,你想把Win编程想象得稍微困难点都找不到理由。
还是那句话,一个程序员做到W.Richard.Stevens那个份上,做到逝世后还能叫全世界的顶级hacker们专门著文怀念,但生前却不曾著文攻击,想想看,那是一种什么样的境界,那是一份什么样的淡然。我们可以大肆讨论技术问题,可以就技术问题进行激烈的卓有成效的讨论,却无意进行基础知识、资源信息的版面重复。我刚在前面贴了一堆isbase的文章,开头就是主页标识,却在后面立刻问什么主页在哪里?前面刚刚讨论过如何修改mac地址,后面马上又来一个,前后相差不过3篇文章。选择沉默已经是很多朋友忍耐力的优异表现了。很多东西都是可以举一反三的。vertex的lids,被packetstorm天天追踪更新,你要是看了THC的那三篇,觉得理解一个就理解了一堆,都是内核模块上的手脚。你不看你怎么知道。我不想在这里陷入具体技术问题的讨论中去,你要是觉得该做点什么了,就自己去看自己去找。没有什么人摆什么架子,也没有什么人生来就是干这个的。

你自己问自己,尽力了吗?

来自:JS版俄罗斯方块代码详细解说
书写过程中的难点

方块变形算法的实现
边界检测和占用检测
方块旋转算法及BUG修复的两种方式

首先说明一下,方块我们是用一维数组来存储四个对象来实现的。方块表示代码如下:

switch (t){
            case 0:{                                   //"田"字形
                this.shape[0] = {x:0, y:0};
                this.shape[1] = {x:1, y:0};
                this.shape[2] = {x:0, y:1};
                this.shape[3] = {x:1, y:1};
                break;
            }
            case 1:{                                   //"|"字形
                this.shape[0] = {x:0, y:0};
                this.shape[1] = {x:0, y:1};
                this.shape[2] = {x:0, y:2};
                this.shape[3] = {x:0, y:3};
                break;
            }
            case 2:{                                   //反"z"字形
                this.shape[0] = {x:0, y:0};
                this.shape[1] = {x:0, y:1};
                this.shape[2] = {x:1, y:1};
                this.shape[3] = {x:1, y:2};
                break;
            }
            case 3:{                                   //"z"字形
                this.shape[0] = {x:1, y:0};
                this.shape[1] = {x:1, y:1};
                this.shape[2] = {x:0, y:1};
                this.shape[3] = {x:0, y:2};
                break;
            }
            case 4:{                                  //"┖"字形
                this.shape[0] = {x:0, y:0};
                this.shape[1] = {x:0, y:1};
                this.shape[2] = {x:1, y:1};
                this.shape[3] = {x:2, y:1};
                break;
            }
            case 5:{                                  //"┛"字形
                this.shape[0] = {x:0, y:1};
                this.shape[1] = {x:1, y:1};
                this.shape[2] = {x:2, y:1};
                this.shape[3] = {x:2, y:0};
                break;
            }
            case 6:{                                   //"┻"字形
                this.shape[0] = {x:1, y:0};
                this.shape[1] = {x:0, y:1};
                this.shape[2] = {x:1, y:1};
                this.shape[3] = {x:2, y:1};
                break;
            }
        }

而上面的x,y代表着他的位置,看起来还真像数学里面学习的二维坐标系。那现在我们就先用数学方法来模拟旋转。请看下图:
请输入图片描述
俄罗斯广场旋转算法详解 向量CA = (X1 – X, Y1 - Y) 把向量CA顺时针旋转90度,得到向量CB,由(CA * CB =0)可知: 向量CB = (Y1 - Y, X – X1) 又由于 向量CB = (X2 – X , Y2 - Y) 故得X2= X – Y + Y1 Y2 = X + Y –X1 由以上的旋转方法,我们就可以对方块进行变形处理。代码如下:(以下是以逆时针方向旋转为基础)

block.prototype.rotate = function(){                
        this.copy();
        //复制当前activeBlock方块,当旋转不符合要求时,可以还原方块
        this.board.eraserActblock();
        var cx = 0,cy = 0;
        for(var i=0; i<this.shape.length; i++){
            cx += this.shape[i].x;
            cy += this.shape[i].y;
        }
        cx = Math.round(cx/this.shape.length);
        cy = Math.round(cy/this.shape.length);
        if(this.blockType == 4 || this.blockType == 5 || this.blockType == 6){   
            //对方块类型进行判断
            for(i = 0; i<this.shape.length; i++){                                
                //旋转方块
                this.shape[i].x = cx + cy - this.backShape[i].y;
                this.shape[i].y = cy - cx + this.backShape[i].x;
            }
        } else if(this.max("x")-this.min("x") == 1 || this.max('x')- this.min('x') == 3) {
            for(i = 0; i<this.shape.length; i++){                                
                //旋转方块
                this.shape[i].x = cx + cy - this.backShape[i].y-1;
                this.shape[i].y = cy - cx + this.backShape[i].x;
            }
        }  else {
            for(i = 0; i<this.shape.length; i++){                                
                //旋转方块
                this.shape[i].x = cx + cy - this.backShape[i].y;
                this.shape[i].y = cy - cx + this.backShape[i].x;
            }
        }
        if(!this.isIllegal()){                            
            //旋转后的方块不符合要求,则还原方块
            for( i=0; i< this.shape.length; i++){
                this.shape[i].x = this.backShape[i].x;
                this.shape[i].y = this.backShape[i].y;
            }
        }
        this.board.paintActblock();
    }

你可以查看DEMO(点击查看演示DEMO),里面也是用逆时针方向来实现的旋转。其中bug,你一看就会知道。(产生的具体原因就自行分析吧!) 旋转算法引起水平偏移BUG的两种解决方案:
进行类型分析,不同类型单独处理(具体代码见上)
方块移动方向改为向下(即可以把旋转方向改为顺时针方向,具体算法实现见上讲旋转算法处),从而达到隐藏bug偏移产生的bug。
方块的边界检测和合法性检测

其实怎么说呢?合法性和边界这两个特性是分不开的。因为边界性如果检测不通过的话,那么合法性也就更不用说了。 边界检测就是检测board对象shape属性保存的数组中对象x、y的值是否在面板内。而占用检测也就是看当前board对象中shape属性保存的数组中对象x、y所对就面板的小方块不否为1,要是为1的话,证明已经被占用,相反则没有占用。实现的代码如下:

block.prototype.isIllegal = function(checkObj){//这个里面放被检测的对象
        var checkObj = checkObj || this.shape;
        for(var i=0; i<checkObj.length; i++){
            if(checkObj[i].x < 0 || checkObj[i].x > (this.board.w-1) || checkObj[i].y<0 || this.board.status[checkObj[i].y][checkObj[i].x] ==1 ){
                return false;
            }
        }
        return true;
    };

欲看详源代码,请请试玩“俄罗斯方块重写”,并占击右键查看源代码。此版本会一直保存,后序版本将会在此版本上进行扩展。并最终实现在手机,电脑上都可以玩。 小结: 第一次利用原生的Javascript来写小游戏。感受颇多!
JavaScript真的很强大。只要你想得到,它几乎都能做得到(可能说的是有点夸张了)。
原来写JS代码多是面向过程来写的。而这次也是尝试着来用面向对象的方法来写,也就使得我对this关键字,作用域链等都有了更加深入的了解。
代码总体来讲是完整了写了两次,第一次写完了,自己实现是看不下去,所以又重写了。但是现在看来现在可以看到的版本,还是存在很多的问题。(在后面的时间里,我会在此基础上进行完善和扩展。)

转载于:https://b.lxd.cc/Tetris_Worlds.html


这可能是史上最短小精悍的javascript编写的俄罗斯方块游戏,因为它仅仅只有60行代码,就实现了俄罗斯游戏所有经典:随机形状、变形、加速、消除。键盘方向键控制,上箭头变形,你要试一试吗?

GO!点击运行代码开始游戏!

<!doctype html><html><head></head>
<body>
<div id="box" style="width:252px;font:25px/25px 宋体;background:#000;color:#9f9;border:#999 20px ridge;text-shadow:2px 3px 1px #0f0;"></div>
<script>
var domain="domain";
var author="author";
var map=eval("["+Array(23).join("0x801,")+"0xfff]");
var tatris=[[0x6600],[0x2222,0xf00],[0xc600,0x2640],[0x6c00,0x4620],[0x4460,0x2e0,0x6220,0x740],[0x2260,0xe20,0x6440,0x4700],[0x2620,0x720,0x2320,0x2700]];
var keycom={"38":"rotate(1)","40":"down()","37":"move(2,1)","39":"move(0.5,-1)"};
var dia, pos, bak, run;
function start(){
    dia=tatris[~~(Math.random()*7)];
    bak=pos={fk:[],y:0,x:4,s:~~(Math.random()*4)};
    rotate(0);
}
function over(){
    document.onkeydown=null;
    clearInterval(run);
    alert("GAME OVER");
}
function update(t){
    bak={fk:pos.fk.slice(0),y:pos.y,x:pos.x,s:pos.s};
    if(t) return;
    for(var i=0,a2=""; i<22; i++)
        a2+=map[i].toString(2).slice(1,-1)+"<br/>";
    for(var i=0,n; i<4; i++)
        if(/([^0]+)/.test(bak.fk[i].toString(2).replace(/1/g,"\u25a1")))
            a2=a2.substr(0,n=(bak.y+i+1)*15-RegExp.$_.length-4)+RegExp.$1+a2.slice(n+RegExp.$1.length);
    document.getElementById("box").innerHTML=a2.replace(/1/g,"\u25a0").replace(/0/g,"\u3000");
}
function is(){
    for(var i=0; i<4; i++)
        if((pos.fk[i]&map[pos.y+i])!=0) return pos=bak;
}
function rotate(r){
    var f=dia[pos.s=(pos.s+r)%dia.length];
    for(var i=0; i<4; i++)
        pos.fk[i]=(f>>(12-i*4)&15)<<pos.x;
    update(is());
}
function down(){
    ++pos.y;
    if(is()){
        for(var i=0; i<4 && pos.y+i<22; i++)
            if((map[pos.y+i]|=pos.fk[i])==0xfff)
                map.splice(pos.y+i,1), map.unshift(0x801);
        if(map[1]!=0x801) return over();
        start();
    }
    update();
}
function move(t,k){
    pos.x+=k;
    for(var i=0; i<4; i++)
        pos.fk[i]*=t;
    update(is());
}
document.onkeydown=function(e){
    eval(keycom[(e?e:event).keyCode]);
};
start();
run=setInterval("down()",400);
</script>
</body>
</html>