分类归档:JavaScript

avaScript是一种能让你的网页更加生动活泼的程式语言,也是目前网页中设计中最容易学又最方便的语言。你可以利用JavaScript轻易的做出亲切的欢迎讯息、漂亮的数字钟、有广告效果的跑马灯及简易的选举,还可以显示浏览器停留的时间。让这些特殊效果提高网页的可观性。

利用 Console 来学习、调试JavaScript

一  什么是 Console

Console 是用于显示 JS和 DOM 对象信息的单独窗口。并且向 JS 中注入1个 console 对象,使用该对象 可以输出信息到 Console 窗口中。

二  什么浏览器支持 Console

很多人可能都知道 Chrome 和 FireFox(FireBug)中都支持 Console。而其他浏览器都支 持不好。比如 IE8 自带的开发工具虽然支持 Console,但功能比较单调,显示对象的时候都是显示 [Object,Object],而且不能点击查看对象里面的属性。IE6、IE7 虽然可以安装 Developer Toolbar,但也 不支持 console。Safari、Opera 都支持 Console,但使用上都没有 FireBug和 Chrome 的方便。 现在firebug推出了 firebuglite工具,可以让所有浏览器都支持Console功能,而且使用上和FireBug read more

javascript面对对象编程(class/object)三种方法

在面向对象编程中,类(class)是对象(object)的模板,定义了同一组对象(又称”实例”)共有的属性和方法。
Javascript语言不支持”类”,但是可以用一些变通的方法,模拟出”类”。
一、构造函数法
这是经典方法,也是教科书必教的方法。它用构造函数模拟”类”,在其内部用this关键字指代实例对象。
function Cat() {
this.name = “大毛”;
}
生成实例的时候,使用new关键字。
var cat1 = new Cat();
alert(cat1.name); // 大毛
类的属性和方法,还可以定义在构造函数的prototype对象之上。
Cat.prototype.makeSound = function(){
alert(“喵喵喵”);
read more

Ckeditor 注册事件

<script type="text/javascript">
    CKEDITOR.instances["Content"].on("instanceReady", function () {  
        //set keyup event  
        this.document.on("keyup", AutoSave);  
        //and click event  
        this.document.on("click", AutoSave);  
        //and select event  
        this.document.on("select", AutoSave);  
    });  
    function AutoSave() {//相应的操作过程,可以按下面写,也可以按一般javascript过程写。  
        CKEDITOR.tools.setTimeout(function () {  
            alert("10101010");  
        }, 0);  
    }     
</script>


javascript中赋值运算符的取余等于“%=”

取余等于运算符 %=
解释 计算两个操作数相除的余数,并将余数赋给左操作数
代码演示 <html>
<head>
<script>
var _param; //定义变量
_param=6;//给变量赋值
_param %=4 ; //对变量进行加运算
document.write(“对变量进行%=4操作后,变量的值:” _param “。</br>”);
</script>
</head>
</html>

javascript中赋值运算符的除等于“/=”

除等于运算符 /=
解释 将两个操作数相除并将商赋给左操作数
代码演示 <html>
<head>
<script>
var _param; //定义变量
_param=6;//给变量赋值
_param /= 2 ; //对变量进行加运算
document.write(“对变量进行/=2操作后,变量的值:” _param “。</br>”);
</script>
</head>
</html>

javascript中运算符的加等于“+=”,及实例代码

加等于运算符 +=
解释 将两个操作数相加并将和赋给左操作数
代码演示由于网站原因可能加号没有显示,在等号前有个加号 <html>
<head>
<script>
var _param; //定义变量
_param=5;//给变量赋值
_param+= 4 ; //对变量进行加运算
document.write(“对变量进行+=4操作后,变量的值:” _param “。</br>”);
</script>
</head>
</html>

javascript中赋值运算符的减等于“-=”及实例代码

减等于运算符 -=
解释 将两个操作数相减并将差赋给左操作数
代码演示 <html>
<head>
<script>
var _param; //定义变量
_param=5;//给变量赋值
_param -= 4 ; //对变量进行加运算
document.write(“对变量进行-=4操作后,变量的值:” _param “。</br>”);
</script>
</head>
</html>

javascript中赋值运算符的乘等于“*=”

乘等于运算符 *=
解释 将两个操作数相乘并将积赋给左操作数
代码演示 <html>
<head>
<script>
var _param; //定义变量
_param=5;//给变量赋值
_param *= 4 ; //对变量进行加运算
document.write(“对变量进行*=4操作后,变量的值:” _param “。</br>”);
</script>
</head>
</html>

JavaScript面向对象继承方式归纳

面向对象的语言多数都支持继承,继承最重要的优点就是代码复用,从而构建大型软件系统。如果一个类能够重用另一个类的属性和或方法,就称之为继承。从这个角度来看看JS的继承方式。JS中继承方式与写类方式息息相关。不同的写类方式造成不同的继承方式。各种流行JS库继承方式也各不相同。从最简单的复用开始。

1、构造函数方式写类,通过方法调用复制父类属性/字段到子类 实现继承

这里父类,子类都采用构造函数方式写,不用原型。子类调用父类函数来复制父类的属性。

Js代码
  1. **
  2.  * 父类Polygon:多边形
  3.  * @param {Object} sides
  4.  */
  5. function Polygon(sides) {
  6.     this.sides = sides;
  7.     this.setSides = function(s) {this.sides=s;}
  8. }
  9. /**
  10.  * 子类Triangle:三角形
  11.  */
  12. function Triangle() {
  13.     this.tempfun = Polygon;//父类引用赋值给子类的一个属性tempfun
  14.     this.tempfun(3);//调用
  15.     delete this.tempfun;//删除该属性
  16.     this.getArea = function(){};
  17. }
  18. //new个对象
  19. var tri = new Triangle();
  20. console.log(tri.sides);//继承的属性
  21. console.log(tri.setSides);//继承的方法
  22. console.log(tri.getArea);//自有的方法
  23. //缺点是对于Triangle的实例对象用instanceof为父类Polygon时是false
  24. console.log(tri instanceof Triangle);//true
  25. console.log(tri instanceof Polygon);//false

read more