javascript实现网页子页面遍历回调的方法(涉及 window.frames、递归函数、函数上下文)


Posted in Javascript onJuly 27, 2015

本文实例讲述了javascript实现网页子页面遍历回调的方法(涉及 window.frames、递归函数、函数上下文)。分享给大家供大家参考。具体如下:

提炼于本人手写的纯 JavaScript 工具程序,用于遍历当前网页的所有子页面 并执行迭代回调,且回调函数返回值可用于结果回传,有助于减少闭包变量~

其特点在于 —— 递归遍历时只检索子页面的 Window 对象,不立即执行回调函数,而是在检索结束后在普通循环结构中回调。这样可以尽量减少 递归调用时的内存消耗,也简化了程序结构,易于维护

全局函数 Frame_Each( CallBack ):

(function (BOM) {
  function All_Frames(iWindow) {
    var _Frames_ = [].slice.call(iWindow.frames, 0);
    for (var i = 0; i < _Frames_.length; i++)
      _Frames_ = _Frames_.concat( arguments.callee(_Frames_[i]) );
    return _Frames_;
  }
  BOM.Frame_Each = function (CallBack) {
    var Frames = [this].concat( All_Frames(this) );
    if (! CallBack) return Frames;
    for (var i = 0, CBR; i < Frames.length; i++) {
      try { Frames[i].name; } catch (iError) { continue; }
      CBR = CallBack.apply(Frames[i], [].slice.call(arguments, 1));
      if (CBR === false) break;
      else if (CBR === undefined) continue;
      return CBR;
    }
  };
})(self);

使用示例:

// 无参数 —— 返回一个数组,包含函数调用所在的 Window 对象及其子页面的 Window,其顺序同递归遍历
var Pages = Frame_Each();
console.log( Pages.length );
// 定义回调 —— 回调返回值功能与普通循环语句的对应:
//  1. undefined:continue
//  2. false:break
//  3. 其它任何值:break && return Value
var Search_Result = Frame_Each(function () {
  var iFocus = this.document.activeElement;
  switch ( iFocus.tagName.toLowerCase() ) {
    case 'body':   return false;
    case 'iframe':  return;
  }
  return iFocus;
});
Search_Result.innerHTML = 'Hello, Focus!';

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
js写一个弹出层并锁屏效果实现代码
Dec 07 Javascript
JavaScript onkeydown事件入门实例(键盘某个按键被按下)
Oct 17 Javascript
jQuery中$.extend()用法实例
Jun 24 Javascript
jQuery ui实现动感的圆角渐变网站导航菜单效果代码
Aug 26 Javascript
跟我学习javascript的闭包
Nov 16 Javascript
JavaScript焦点事件、鼠标事件和滚轮事件使用详解
Jan 15 Javascript
原生js实现商品放大镜效果
Jan 12 Javascript
angular+ionic 的app上拉加载更新数据实现方法
Jan 16 Javascript
AngularJS的ng-repeat指令与scope继承关系实例详解
Jan 21 Javascript
JSON与js对象序列化实例详解
Mar 16 Javascript
vue中手机号,邮箱正则验证以及60s发送验证码的实例
Mar 16 Javascript
JS的深浅复制详细
Oct 16 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
Jul 27 #Javascript
使用HTML+CSS+JS制作简单的网页菜单界面
Jul 27 #Javascript
Javascript验证Visa和MasterCard信用卡号的方法
Jul 27 #Javascript
JavaScript实现自动对页面上敏感词进行屏蔽的方法
Jul 27 #Javascript
javascript实现类似于新浪微博搜索框弹出效果的方法
Jul 27 #Javascript
JavaScript动态提示输入框输入字数的方法
Jul 27 #Javascript
JQUERY实现网页右下角固定位置展开关闭特效的方法
Jul 27 #Javascript
You might like
一些PHP Coding Tips(php小技巧)[2011/04/02最后更新]
2011/05/02 PHP
php写的简易聊天室代码
2011/06/04 PHP
php 实现简单的登录功能示例【基于thinkPHP框架】
2019/12/02 PHP
jQuery实用基础超详细介绍
2013/04/11 Javascript
基于KMP算法JavaScript的实现方法分析
2013/05/03 Javascript
JS中获取数据库中的值的方法
2013/07/14 Javascript
深入剖析JavaScript中的枚举功能
2014/03/06 Javascript
JavaScript判断textarea值是否为空并给出相应提示
2014/09/04 Javascript
JavaScript数组常用方法
2015/03/02 Javascript
JavaScript动态提示输入框输入字数的方法
2015/07/27 Javascript
javascript实现简易计算器的代码
2016/05/31 Javascript
jQuery表单插件ajaxForm实例详解
2017/01/17 Javascript
史上最全JavaScript常用的简写技巧(推荐)
2017/08/17 Javascript
JS与HTML结合实现流程进度展示条思路详解
2017/09/03 Javascript
解决nodejs的npm命令无反应的问题
2018/05/17 NodeJs
JS伪继承prototype实现方法示例
2018/06/20 Javascript
解决layer.prompt无效的问题
2019/09/24 Javascript
[42:52]IG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
用Python进行行为驱动开发的入门教程
2015/04/23 Python
Python中if elif else及缩进的使用简述
2018/05/31 Python
解决Python3中的中文字符编码的问题
2018/07/18 Python
django Serializer序列化使用方法详解
2018/10/16 Python
python实现简单名片管理系统
2018/11/30 Python
Python 连接 MySQL 的几种方法
2020/09/09 Python
50个强大璀璨的CSS3/JS技术运用实例
2010/02/27 HTML / CSS
意大利珠宝店:Luxury Zone
2019/01/05 全球购物
Why do we need Unit test
2013/01/03 面试题
计算机专业优秀大学生自我总结
2014/01/21 职场文书
爽歪歪广告词
2014/03/20 职场文书
2014预防青少年违法犯罪工作总结
2014/12/10 职场文书
2015年感恩母亲节的演讲稿
2015/03/18 职场文书
新学期开学寄语2016
2015/12/04 职场文书
2016教师廉洁从教心得体会
2016/01/13 职场文书
什么是检讨书?检讨书的格式及范文
2019/11/05 职场文书
laravel添加角色和模糊搜索功能的实现代码
2021/06/22 PHP
Java8中接口的新特性使用指南
2021/11/01 Java/Android