初学者web前端学习笔记

对于 if 语句括号里的表达式,ECMAScript 会自动调用 Boolean()转型函数将这个表达式的结果转换成一个布尔值。如果值为 true,执行后面的一条语句,否则不执行。

2.arguments相关

通过arguments 对象的length属性,来智能的判断有多少参数,然后把参数进行合理的应用 。
比如,要实现一个加法运算,将所有传进来的数字累加,而数字的个数又不确定。

function box() {         var sum = 0;         if (arguments.length == 0) return sum; //如果没有参数,退出         for(var i = 0;i < arguments.length; i++) { //如果有,就累加             sum = sum + arguments[i];         }         return sum; //返回累加结果     }     alert(box(5,9,12)); 3.函数内部属性

函数内部,有两个特殊的对象:arguments 和 this。arguments 是一个类数组对象,包含着传入函数中的所有参数,主要用途是保存函数参数。但这个对象还有一个名叫 callee 的属性,该属性是一个指针,指向拥有这个 arguments 对象的函数。
对于阶乘函数一般要用到递归算法,所以函数内部一定会调用自身;如果函数名不改变是没有问题的,但一旦改变函数名,内部的自身调用需要逐一修改。为了解决这个问题,我们可以使用 arguments.callee 来代替。

function box(num) {         if (num <= 1) {             return 1;         } else {             return num * arguments.callee(num-1);//使用 callee 来执行自身         }     } 4.event对象

直接接收 event 对象,是 W3C 的做法,IE 不支持,IE 自己定义了一个 event 对象,直接在 window.event 获取即可。

input.onclick = function (evt) {     var e = evt || window.event; //实现跨浏览器兼容获取 event 对象     alert(e); }; 5.事件的目标

W3C 中的 target 和 IE 中的 srcElement,都表示事件的目标。

function getTarget(evt) {     var e = evt || window.event;     return e.target || e.srcElement; //兼容得到事件目标 DOM 对象 }document.onclick = function (evt) {     var target = getTarget(evt);     alert(target); }; 6.阻止事件冒泡

在阻止冒泡的过程中,W3C 和 IE 采用的不同的方法,那么我们必须做一下兼容。

function stopPro(evt) {     var e = evt || window.event;     window.event ? e.cancelBubble = true : e.stopPropagation(); } 7.阻止事件默认行为 function preDef(evt) {     var e = evt || window.event;     if (e.preventDefault) {         e.preventDefault();     } else {         e.returnValue = false;     } } 8.上下文菜单事件:contextmenu

当我们右击网页的时候,会自动出现 windows 自带的菜单。那么我们可以使用 contextmenu 事件来修改我们指定的菜单,但前提是把右击的默认行为取消掉。

function addEvent(obj, type, fn) { //添加事件兼容     if (obj.addEventListener) {         obj.addEventListener(type, fn);     } else if (obj.attachEvent) {         obj.attachEvent(\'on\' + type, fn);     } }function removeEvent(obj, type, fn) { //移除事件兼容     if (obj.removeEventListener) {     ob    j.removeEventListener(type, fn);     } else if (obj.detachEvent) {         obj.detachEvent(\'on\' + type, fn);     } }     addEvent(window, \'load\', function () {     var text = document.getElementById(\'text\');     addEvent(text, \'contextmenu\', function (evt) {         var e = evt || window.event;         preDef(e);         var menu = document.getElementById(\'menu\');         menu.style.left = e.clientX + \'px\';         menu.style.top = e.clientY + \'px\';         menu.style.visibility = \'visible\';         addEvent(document, \'click\', function () {             document.getElementById(\'myMenu\').style.visibility = \'hidden\';         });     }); }); 9.js中的文档模式-document.compatMode

文档模式在开发中貌似很少用到,最常见的是就是在获取页面宽高的时候,比如文档宽高,可见区域宽高等。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zzfdfd.html