Ruby web前端观察

摘要： 背景之前的项目中，有很多的登记页面，一般都有100-200甚至更加多的字段，而且还涉及到字典、日期及其他效果的显示，载入时很慢，而且会有卡死的现象，IE下特别明显IE调试工具探查器的使用当时找了不少资料，不过最后还是把目光聚焦到IE自带的调试工具了目前我电脑里面的是IE10，当时分析时用的是IE9，里面有一页探查器引起了我的注意，经过一轮的折腾，掌握了其分析方法如下：打开要分析的页面，F12进入开发人员工具，并切换到探查器页面在点击开始采样后进行一系列的操作（由于我的问题是载入页面的效率，自然是刷新页面），结束后再次点击该按钮则会有结果，把视图切换成调用树，则最耗时的函数调用就会一目了然找到问 阅读全文

摘要： Aop又叫面向切面编程，用过spring的同学肯定对它非常熟悉，而在js中，AOP是一个被严重忽视的技术点，这篇就通过下面这几个小例子，来说说AOP在js中的妙用.1, 防止window.onload被二次覆盖.2，无侵入的统计代码.3, 分离表单请求和校验.4，给ajax请求动态添加参数.5，职责链模式.6, 组合代替继承.先给出before和after这2个“切面”函数. 顾名思义，就是让一个函数在另一个函数之前或者之后执行，巧妙的是，before或者after都可以和当前的函数公用this和arguments, 这样一来供我们发挥的地方就多着了.处理window.onload被二次覆盖. 阅读全文

摘要： 跨域问题跨域的形成：主域、子域、ip和域名、协议不同、端口不同常用解决方案iframe+document.domain：适用于垮子域的情况缺点是如果一个域名下存在安全问题，另一个域名下可能也会有问题，还有就是创建iframe的开销动态引入js脚本：适合所有的跨域场景引入的脚本会立刻执行，存在安全风险要与远端沟通约定变量，增加了开发和维护成本iframe+location.hash：适合各种场景下跨域iframe嵌套引用，开销更大会产生历史记录，url中暴露传递的内容iframe+window.name：使用iframe的window.name从外域传递数据到本地域，适合各种场景下跨域且数据安全 阅读全文

摘要： jQuery(window).height()代表了当前可见区域的大小，而jQuery(document).height()则代表了整个文档的高度，可视具体情况使用. 注意当浏览器窗口大小改变时(如最大化或拉大窗口后) jQuery(window).height() 随之改变，但是jQuery(document).height()是不变的。$(document).scrollTop() 获取垂直滚动的距离 即当前滚动的地方的窗口顶端到整个页面顶端的距离$(document).scrollLeft() 这是获取水平滚动条的距离要获取顶端 只需要获取到scrollTop()==0的时候 就是顶.. 阅读全文

摘要： 看过goole closure 的同学都知道 其中定义一个类名函数时候只要 inlude("") 想加载某个模块只要require("")就可以利用：下面给出一个例子： 分模块加载 View Code 阅读全文

摘要： $E.on = function (o, e, f) { return o.addEventListener ? o.addEventListener(e, f, false) : o.attachEvent('on'+e, function () { f.call(o) });};$E.on(document.getElementById('dele-ul'), 'click', function (e) { var tar = e.target || e.srcElement; if (tar.nodeName.toLowerCase() = 阅读全文

摘要： http://www.cnblogs.com/hongru/archive/2012/03/16/2394332.html 转分享地址 阅读全文

摘要： /** * @namespace DOM Ready * 兼容某些页面头部没有引用jquery * @function * @param {Function} fn * @example * DOMReady(fn) */window.DOMReady = function() { var evt = [], isReady = false, guid = 1, randomKey = +new Date(); /** @ignore 执行并销毁队列事件 */ var fire = function() { if (!e... 阅读全文

摘要： 判断点在多边形外算法：通过改点做一条水平射线：如果与多边形有 偶数个交点则说明点在多边形外，否则点在多边形内。以下通过一个简单例子：http://888.qq.com/promote/party/2013/0801_jczq/index.shtml#nogovar o = { init: function () { o.initParty(); this.flag = false; //鼠标位于多边形内 this.pos = 0; //记录位于哪个多边形 this.lastpos = -1; this.point = { x: 0, y: 0... 阅读全文

摘要： http://www.cnblogs.com/hongru/archive/2012/03/31/2427590.htmlhttp://www.cnblogs.com/hongru/archive/2012/01/10/2318188.html 博客地址http://www.cnblogs.com/hongru/archive/2010/12/27/1918018.html 前端 加载框架一个方法 阅读全文