一. 简介
二.Number 对象
三.字符串(String)对象
四.Date(日期)对象
五.Array(数组)对象
六.Boolean(布尔)对象
七.Math(算数)对象
八.JavaScripy execCommand函数
一. 简介
1.JavaScript 对象
JavaScript 中的所有事物都是对象:字符串、数值、数组、函数...
此外,JavaScript 允许自定义对象。
所有事物都是对象
JavaScript 提供多个内建对象,比如 String、Date、Array 等等。 对象只是带有属性和方法的特殊数据类型。
- 布尔型可以是一个对象。
- 数字型可以是一个对象。
- 字符串也可以是一个对象
- 日期是一个对象
- 数学和正则表达式也是对象
- 数组是一个对象
- 甚至函数也可以是对象
JavaScript 对象
对象只是一种特殊的数据。对象拥有属性和方法。
访问对象的属性
属性是与对象相关的值。
访问对象属性的语法是:
objectName.propertyName
这个例子使用了 String 对象的 length 属性来获得字符串的长度:
var message="Hello World!";
var x=message.length;
2.访问对象的方法
方法是能够在对象上执行的动作。
您可以通过以下语法来调用方法:
objectName.methodName()
//这个例子使用了 String 对象的 toUpperCase() 方法来将文本转换为大写: var message="Hello world!"; var x=message.toUpperCase();
3.创建 JavaScript 对象
通过 JavaScript,您能够定义并创建自己的对象。
创建新对象有两种不同的方法:
- 定义并创建对象的实例
- 使用函数来定义对象,然后创建新的对象实例
person=new Object(); person.firstname="John"; person.lastname="Doe"; person.age=50; person.eyecolor="blue";
//替代语法(使用对象 literals): person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};
二 .Number 对象
-
1.JavaScript Number 对象
-
JavaScript 的 Number 对象是经过封装的能让你处理数字值的对象。
JavaScript 的 Number 对象由 Number() 构造器创建。
JavaScript 只有一种数字类型。
可以使用也可以不使用小数点来书写数字。
2.JavaScript 数字
//JavaScript 数字可以使用也可以不使用小数点来书写: var pi=3.14; // 使用小数点 var x=34; // 不使用小数点 //极大或极小的数字可通过科学(指数)计数法来写: var y=123e5; // 12300000 var z=123e-5; // 0.00123
3.所有 JavaScript 数字均为 64 位
JavaScript 不是类型语言。与许多其他编程语言不同,JavaScript 不定义不同类型的数字,比如整数、短、长、浮点等等。
4.精度
整数(不使用小数点或指数计数法)最多为 15 位。
小数的最大位数是 17,但是浮点运算并不总是 100% 准确
var x = 0.2+0.1; // result will be 0.30000000000000004
5.八进制和十六进制
如果前缀为 0,则 JavaScript 会把数值常量解释为八进制数,如果前缀为 0 和 "x",则解释为十六进制数。
var y = 0377; var z = 0xFF;
默认情况下,JavaScript 数字为十进制显示。
但是你可以使用 toString() 方法 输出16进制、8进制、2进制。
var myNumber=128; myNumber.toString(16); // returns 80 myNumber.toString(8); // returns 200 myNumber.toString(2); // returns 10000000
6.无穷大(Infinity)
当数字运算结果超过了JavaScript所能表示的数字上限(溢出),结果为一个特殊的无穷大(infinity)值,在JavaScript中以Infinity表示。同样地,当负数的值超过了JavaScript所能表示的负数范围,结果为负无穷大,在JavaScript中以-Infinity表示。无穷大值的行为特性和我们所期望的是一致的:基于它们的加、减、乘和除运算结果还是无穷大(当然还保留它们的正负号)。
myNumber=2; while (myNumber!=Infinity) { myNumber=myNumber*myNumber; // Calculate until Infinity }
7.NaN - 非数字值
NaN 属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。可以把 Number 对象设置为该值,来指示其不是数字值。
你可以使用 isNaN() 全局函数来判断一个值是否是 NaN 值。
var x = 1000 / "Apple"; isNaN(x); // returns true var y = 100 / "1000"; isNaN(y); // returns false
除以0是无穷大,无穷大是一个数字
var x = 1000 / 0; isNaN(x); // returns false
提示:在 JavaScript 中,如果参数无法被转换为数字,则返回 NaN。
8.数字可以是数字或者对象
数字可以私有数据进行初始化,就像 x = 123;
JavaScript 数字对象初始化数据, var y = new Number(123);
var x = 123; var y = new Number(123); typeof(x) // returns Number typeof(y) // returns Object
var x = 123; var y = new Number(123); (x === y) // is false because x is a number and y is an object.
9.数字属性
- MAX_VALUE
- MIN_VALUE
- NEGATIVE_INFINITY
- POSITIVE_INFINITY
- NaN
- prototype
- constructor
10.数字方法
- toExponential()
- toFixed()
- toPrecision()
- toString()
- valueOf()
Number 对象属性
属性 描述 constructor 返回对创建此对象的 Number 函数的引用。 MAX_VALUE 可表示的最大的数。 MIN_VALUE 可表示的最小的数。 NEGATIVE_INFINITY 负无穷大,溢出时返回该值。 NaN 非数字值。 POSITIVE_INFINITY 正无穷大,溢出时返回该值。 prototype 允许您有能力向对象添加属性和方法。 Number 对象方法
方法 描述 toExponential(x) 把对象的值转换为指数计数法。 toFixed(x) 把数字转换为字符串,结果的小数点后有指定位数的数字。 toPrecision(x) 把数字格式化为指定的长度。 toString() 把数字转换为字符串,使用指定的基数。 valueOf() 返回一个 Number 对象的基本数字值。 三.字符串(String)对象
JavaScript 字符串(String) 对象
String 对象用于处理已有的字符块。
1.JavaScript 字符串
一个字符串用于存储一系列字符就像 "John Doe".
一个字符串可以使用单引号或双引号:
var carname="Volvo XC60"; var carname='Volvo XC60';
你使用位置(索引)可以访问字符串中任何的字符:
var character=carname[7];
字符串的索引从零开始, 所以字符串第一字符为 [0],第二个字符为 [1], 等等。
你可以在字符串中使用引号,如下实例:
var answer="It's alright"; var answer="He is called 'Johnny'"; var answer='He is called "Johnny"';
或者你可以在字符串中使用转义字符(\)使用引号:
var answer='It\'s alright'; var answer="He is called \"Johnny\"";
2.字符串(String)
字符串(String)使用长度属性length来计算字符串的长度:
var txt="Hello World!"; document.write(txt.length); var txt="ABCDEFGHIJKLMNOPQRSTUVWXYZ"; document.write(txt.length);
3.在字符串中查找字符串
字符串使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置:
var str="Hello world, welcome to the universe."; var n=str.indexOf("welcome");
如果没找到对应的字符函数返回-1
lastIndexOf() 方法在字符串末尾开始查找字符串出现的位置。
4.内容匹配
match()函数用来查找字符串中特定的字符,并且如果找到的话,则返回这个字符。
var str="Hello world!"; document.write(str.match("world") + "<br>"); document.write(str.match("World") + "<br>"); document.write(str.match("world!"));
5.替换内容
replace() 方法在字符串中用某些字符替换另一些字符。
str="Please visit Microsoft!" var n=str.replace("Microsoft","w3cschool");
6.字符串大小写转换
字符串大小写转换使用函数 toUpperCase() / toLowerCase():
var txt="Hello World!"; // String var txt1=txt.toUpperCase(); // txt1 is txt converted to upper var txt2=txt.toLowerCase(); // txt2 is txt converted to lower
7.字符串转为数组
字符串使用string>split()函数转为数组:
txt="a,b,c,d,e" // String txt.split(","); // Split on commas txt.split(" "); // Split on spaces txt.split("|"); // Split on pipe
8.特殊字符
Javascript 中可以使用反斜线(\)插入特殊符号,如:撇号,引号等其他特殊符号。
JavaScript将输出正确的文本字符串:We are the so-called "Vikings" from the north.
下表列出其他特殊字符,可以使用反斜线转义特殊字符:
代码 输出 \' 单引号 \" 双引号 \\ 斜杆 \n 换行 \r 回车 \t tab \b 空格 \f 换页
9.字符串属性和方法
属性:
- length
- prototype
- constructor
方法:
-
- charAt()
- charCodeAt()
- concat()
- fromCharCode()
- indexOf()
- lastIndexOf()
- match()
- replace()
- search()
- slice()
- split()
- substr()
- substring()
- toLowerCase()
- toUpperCase()
- valueOf()
String 对象属性
属性 描述 constructor 对创建该对象的函数的引用 length 字符串的长度 prototype 允许您向对象添加属性和方法 String 对象方法
方法 描述 charAt() 返回在指定位置的字符。 charCodeAt() 返回在指定的位置的字符的 Unicode 编码。 concat() 连接两个或更多字符串,并返回新的字符串。 fromCharCode() 将 Unicode 编码转为字符。 indexOf() 返回某个指定的字符串值在字符串中首次出现的位置。 lastIndexOf() 从后向前搜索字符串。 match() 查找找到一个或多个正则表达式的匹配。 replace() 在字符串中查找匹配的子串, 并替换与正则表达式匹配的子串。 search() 查找与正则表达式相匹配的值。 slice() 提取字符串的片断,并在新的字符串中返回被提取的部分。 split() 把字符串分割为字符串数组。 substr() 从起始索引号提取字符串中指定数目的字符。 substring() 提取字符串中两个指定的索引号之间的字符。 toLowerCase() 把字符串转换为小写。 toUpperCase() 把字符串转换为大写。 trim() 去除字符串两边的空白 valueOf() 返回某个字符串对象的原始值。 String HTML 包装方法
HTML 包装方法返回加入了适当HTML标签的字符串。
方法 描述 anchor() 创建 HTML 锚。 big() 用大号字体显示字符串。 blink() 显示闪动字符串。 bold() 使用粗体显示字符串。 fixed() 以打字机文本显示字符串。 fontcolor() 使用指定的颜色来显示字符串。 fontsize() 使用指定的尺寸来显示字符串。 italics() 使用斜体显示字符串。 link() 将字符串显示为链接。 small() 使用小字号来显示字符串。 strike() 用于显示加删除线的字符串。 sub() 把字符串显示为下标。 sup() 把字符串显示为上标。
四.Date(日期)对象
1.JavaScript Date(日期) 对象
日期对象用于处理日期和时间。
返回当日的日期和时间
如何使用 Date() 方法获得当日的日期。
getFullYear()
使用 getFullYear() 获取年份。
getTime()
getTime() 返回从 1970 年 1 月 1 日至今的毫秒数。
setFullYear()
如何使用 setFullYear() 设置具体的日期。
toUTCString()
如何使用 toUTCString() 将当日的日期(根据 UTC)转换为字符串。
getDay()
如何使用 getDay() 和数组来显示星期,而不仅仅是数字。
Display a clock
如何在网页上显示一个钟表。
2.Date 对象属性
属性 | 描述 |
---|---|
constructor | 返回对创建此对象的 Date 函数的引用。 |
prototype | 使您有能力向对象添加属性和方法。 |
3.Date 对象方法
方法 | 描述 |
---|---|
getDate() | 从 Date 对象返回一个月中的某一天 (1 ~ 31)。 |
getDay() | 从 Date 对象返回一周中的某一天 (0 ~ 6)。 |
getFullYear() | 从 Date 对象以四位数字返回年份。 |
getHours() | 返回 Date 对象的小时 (0 ~ 23)。 |
getMilliseconds() | 返回 Date 对象的毫秒(0 ~ 999)。 |
getMinutes() | 返回 Date 对象的分钟 (0 ~ 59)。 |
getMonth() | 从 Date 对象返回月份 (0 ~ 11)。 |
getSeconds() | 返回 Date 对象的秒数 (0 ~ 59)。 |
getTime() | 返回 1970 年 1 月 1 日至今的毫秒数。 |
getTimezoneOffset() | 返回本地时间与格林威治标准时间 (GMT) 的分钟差。 |
getUTCDate() | 根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。 |
getUTCDay() | 根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。 |
getUTCFullYear() | 根据世界时从 Date 对象返回四位数的年份。 |
getUTCHours() | 根据世界时返回 Date 对象的小时 (0 ~ 23)。 |
getUTCMilliseconds() | 根据世界时返回 Date 对象的毫秒(0 ~ 999)。 |
getUTCMinutes() | 根据世界时返回 Date 对象的分钟 (0 ~ 59)。 |
getUTCMonth() | 根据世界时从 Date 对象返回月份 (0 ~ 11)。 |
getUTCSeconds() | 根据世界时返回 Date 对象的秒钟 (0 ~ 59)。 |
getYear() | 已废弃。 请使用 getFullYear() 方法代替。 |
parse() | 返回1970年1月1日午夜到指定日期(字符串)的毫秒数。 |
setDate() | 设置 Date 对象中月的某一天 (1 ~ 31)。 |
setFullYear() | 设置 Date 对象中的年份(四位数字)。 |
setHours() | 设置 Date 对象中的小时 (0 ~ 23)。 |
setMilliseconds() | 设置 Date 对象中的毫秒 (0 ~ 999)。 |
setMinutes() | 设置 Date 对象中的分钟 (0 ~ 59)。 |
setMonth() | 设置 Date 对象中月份 (0 ~ 11)。 |
setSeconds() | 设置 Date 对象中的秒钟 (0 ~ 59)。 |
setTime() | setTime() 方法以毫秒设置 Date 对象。 |
setUTCDate() | 根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。 |
setUTCFullYear() | 根据世界时设置 Date 对象中的年份(四位数字)。 |
setUTCHours() | 根据世界时设置 Date 对象中的小时 (0 ~ 23)。 |
setUTCMilliseconds() | 根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。 |
setUTCMinutes() | 根据世界时设置 Date 对象中的分钟 (0 ~ 59)。 |
setUTCMonth() | 根据世界时设置 Date 对象中的月份 (0 ~ 11)。 |
setUTCSeconds() | setUTCSeconds() 方法用于根据世界时 (UTC) 设置指定时间的秒字段。 |
setYear() | 已废弃。请使用 setFullYear() 方法代替。 |
toDateString() | 把 Date 对象的日期部分转换为字符串。 |
toGMTString() | 已废弃。请使用 toUTCString() 方法代替。 |
toISOString() | 使用 ISO 标准返回字符串的日期格式。 |
toJSON() | 以 JSON 数据格式返回日期字符串。 |
toLocaleDateString() | 根据本地时间格式,把 Date 对象的日期部分转换为字符串。 |
toLocaleTimeString() | 根据本地时间格式,把 Date 对象的时间部分转换为字符串。 |
toLocaleString() | 据本地时间格式,把 Date 对象转换为字符串。 |
toString() | 把 Date 对象转换为字符串。 |
toTimeString() | 把 Date 对象的时间部分转换为字符串。 |
toUTCString() | 根据世界时,把 Date 对象转换为字符串。 |
UTC() | 根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。 |
valueOf() | 返回 Date 对象的原始值。 |
4.创建日期
Date 对象用于处理日期和时间。
可以通过 new 关键词来定义 Date 对象。以下代码定义了名为 myDate 的 Date 对象:
有四种方式初始化日期:
new Date() // 当前日期和时间 new Date(milliseconds) //返回从 1970 年 1 月 1 日至今的毫秒数 new Date(dateString) new Date(year, month, day, hours, minutes, seconds, milliseconds)
上面的参数大多数都是可选的,在不指定的情况下,默认参数是0。
从 1970 年 1 月 1 日通用一天计算为86,400,000毫秒
实例化一个日期的一些例子:
var today = new Date() var d1 = new Date("October 13, 1975 11:13:00") var d2 = new Date(79,5,24) var d3 = new Date(79,5,24,11,33,0)
5.设置日期
通过使用针对日期对象的方法,我们可以很容易地对日期进行操作。
//在下面的例子中,我们为日期对象设置了一个特定的日期 (2010 年 1 月 14 日): var myDate=new Date(); myDate.setFullYear(2010,0,14); //在下面的例子中,我们将日期对象设置为 5 天后的日期: var myDate=new Date(); myDate.setDate(myDate.getDate()+5);
注意: 如果增加天数会改变月份或者年份,那么日期对象会自动完成这种转换。
6.两个日期比较
日期对象也可用于比较两个日期。
下面的代码将当前日期与 2100 年 1 月 14 日做了比较:
var x=new Date(); x.setFullYear(2100,0,14); var today = new Date(); if (x>today) { alert("Today is before 14th January 2100"); } else { alert("Today is after 14th January 2100"); }
五.Array(数组)对象
1.JavaScript Array(数组) 对象
数组对象的作用是:使用单独的变量名来存储一系列的值。
创建数组, 为其赋值:
var mycars = new Array(); mycars[0] = "Saab"; mycars[1] = "Volvo"; mycars[2] = "BMW";
提示:在JavaScript数组中,第一个数组元素的索引值为 0,第二个索引值为 1,依次类推。
2.什么是数组?
数组对象是使用单独的变量名来存储一系列的值。
如果你有一组数据(例如:车名字),存在单独变量如下所示:
var car1="Saab"; var car2="Volvo"; var car3="BMW";
然而,如果你想从中找出某一辆车?并且不是3辆,而是300辆呢?这将不是一件容易的事!
最好的方法就是用数组。
数组可以用一个变量名存储所有的值,并且可以用变量名访问任何一个值。
数组中的每个元素都有自己的的ID,以便它可以很容易地被访问到。
3.创建一个数组
创建一个数组,有三种方法。
下面的代码定义了一个名为 myCars的数组对象:
//1: 常规方式: var myCars=new Array(); myCars[0]="Saab"; myCars[1]="Volvo"; myCars[2]="BMW"; //2: 简洁方式: var myCars=new Array("Saab","Volvo","BMW"); //3: 字面: var myCars=["Saab","Volvo","BMW"];
4.访问数组
通过指定数组名以及索引号码,你可以访问某个特定的元素。
//以下实例可以访问myCars数组的第一个值: var name=myCars[0]; //以下实例修改了数组 myCars 的第一个元素: myCars[0]="Opel";
5.在一个数组中你可以有不同的对象
所有的JavaScript变量都是对象。数组元素是对象。函数是对象。
因此,你可以在数组中有不同的变量类型。
你可以在一个数组中包含对象元素、函数、数组:
myArray[0]=Date.now; myArray[1]=myFunction; myArray[2]=myCars;
6.数组方法和属性
使用数组对象预定义属性和方法:
var x=myCars.length // the number of elements in myCars var y=myCars.indexOf("Volvo") // the index position of "Volvo"
Array 对象方法
方法 | 描述 |
---|---|
concat() | 连接两个或更多的数组,并返回结果。 |
every() | 检测数组元素的每个元素是否都符合条件。 |
filter() | 检测数组元素,并返回符合条件所有元素的数组。 |
indexOf() | 搜索数组中的元素,并返回它所在的位置。 |
join() | 把数组的所有元素放入一个字符串。 |
lastIndexOf() | 返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。 |
map() | 通过指定函数处理数组的每个元素,并返回处理后的数组。 |
pop() | 删除数组的最后一个元素并返回删除的元素。 |
push() | 向数组的末尾添加一个或更多元素,并返回新的长度。 |
reverse() | 反转数组的元素顺序。 |
shift() | 删除数组的第一个元素。 |
slice() | 选取数组的的一部分,并返回一个新数组。 |
some() | 检测数组元素中是否有元素符合指定条件。 |
sort() | 对数组的元素进行排序。 |
splice() | 从数组中添加或删除元素。 |
toString() | 把数组转换为字符串,并返回结果。 |
unshift() | 向数组的开头添加一个或更多元素,并返回新的长度。 |
valueOf() | 返回数组对象的原始值。 |
7. 创建新方法
原型是JavaScript全局构造函数。它可以构建新Javascript对象的属性和方法。
Array.prototype.ucase=function() { for (i=0;i<this.length;i++) {this[i]=this[i].toUpperCase();} }
六.Boolean(布尔)对象
1.JavaScript Boolean(布尔) 对象
Boolean(布尔)对象用于将非布尔值转换为布尔值(true 或者 false)。
Boolean(布尔)对象是三种包装对象:Number、String和Boolean中最简单的一种,它没有大量的实例属性和方法。
2.创建 Boolean 对象
Boolean 对象代表两个值:"true" 或者 "false"
下面的代码定义了一个名为 myBoolean 的布尔对象:
var myBoolean=new Boolean();
如果布尔对象无初始值或者其值为:
- 0
- -0
- null
- ""
- false
- undefined
- NaN
那么对象的值为 false。否则,其值为 true(即使当自变量为字符串 "false" 时)!
七.Math(算数)对象
1.JavaScript Math(算数) 对象
Math(算数)对象的作用是:执行常见的算数任务。
round()
如何使用 round()。
random()
如何使用 random() 来返回 0 到 1 之间的随机数。
max()
如何使用 max() 来返回两个给定的数中的较大的数。(在 ECMASCript v3 之前,该方法只有两个参数。)
min()
如何使用 min() 来返回两个给定的数中的较小的数。(在 ECMASCript v3 之前,该方法只有两个参数。)
2.Math 对象属性
属性 | 描述 |
---|---|
E | 返回算术常量 e,即自然对数的底数(约等于2.718)。 |
LN2 | 返回 2 的自然对数(约等于0.693)。 |
LN10 | 返回 10 的自然对数(约等于2.302)。 |
LOG2E | 返回以 2 为底的 e 的对数(约等于 1.414)。 |
LOG10E | 返回以 10 为底的 e 的对数(约等于0.434)。 |
PI | 返回圆周率(约等于3.14159)。 |
SQRT1_2 | 返回返回 2 的平方根的倒数(约等于 0.707)。 |
SQRT2 | 返回 2 的平方根(约等于 1.414)。 |
3.Math 对象方法
方法 | 描述 |
---|---|
abs(x) | 返回 x 的绝对值。 |
acos(x) | 返回 x 的反余弦值。 |
asin(x) | 返回 x 的反正弦值。 |
atan(x) | 以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。 |
atan2(y,x) | 返回从 x 轴到点 (x,y) 的角度(介于 -PI/2 与 PI/2 弧度之间)。 |
ceil(x) | 对数进行上舍入。 |
cos(x) | 返回数的余弦。 |
exp(x) | 返回 Ex 的指数。 |
floor(x) | 对 x 进行下舍入。 |
log(x) | 返回数的自然对数(底为e)。 |
max(x,y,z,...,n) | 返回 x,y,z,...,n 中的最高值。 |
min(x,y,z,...,n) | 返回 x,y,z,...,n中的最低值。 |
pow(x,y) | 返回 x 的 y 次幂。 |
random() | 返回 0 ~ 1 之间的随机数。 |
round(x) | 把数四舍五入为最接近的整数。 |
sin(x) | 返回数的正弦。 |
sqrt(x) | 返回数的平方根。 |
tan(x) | 返回角的正切。 |
4.Math 对象
Math(算数)对象的作用是:执行普通的算数任务。
Math 对象提供多种算数值类型和函数。无需在使用这个对象之前对它进行定义。
使用Math的属性/方法的语法:
var x=Math.PI; var y=Math.sqrt(16);
注意: Math对象无需在使用这个对象之前对它进行定义。
提示: Math 对象不能使用 new 关键字创建对象实例。直接用 “对象名.成员”的格式来访问其属性或者方法。
5.算数值
JavaScript 提供 8 种可被 Math 对象访问的算数值:
你可以参考如下Javascript常量使用方法:
Math.E
Math.PI
Math.SQRT2
Math.SQRT1_2
Math.LN2
Math.LN10
Math.LOG2E
Math.LOG10E
算数方法
除了可被 Math 对象访问的算数值以外,还有几个函数(方法)可以使用。
下面的例子使用了 Math 对象的 round 方法对一个数进行四舍五入。
document.write(Math.round(4.7));
下面的例子使用了 Math 对象的 random() 方法来返回一个介于 0 和 1 之间的随机数:
document.write(Math.random());
你也可以在JavaScript编程实战中练习使用random()生成随机小数。
下面的例子使用了 Math 对象的 floor() 方法和 random() 来返回一个介于 0 和 11 之间的随机数:
document.write(Math.floor(Math.random()*11));
八.JavaScripy execCommand函数
execCommand方法是执行一个对当前文档,当前选择或者给出范围的命令。处理Html数据时常用
如下格式:document.execCommand(sCommand[,交互方式, 动态参数]) ,其中:sCommand为指令参数(如下例中的”2D-Position”),交互方式参数如果是true的话将显示对话框,如果为false的话,则不显示对话框(下例中的”false”即表示不显示对话框),动态参数一般为一可用值或属性值(如下例中的”true”)。
document.execCommand("2D-Position","false","true");
下面列出的是指令参数及意义
2D-Position 允许通过拖曳移动绝对定位的对象。
AbsolutePosition 设定元素的 position 属性为“absolute”(绝对)。
BackColor 设置或获取当前选中区的背景颜色。
BlockDirLTR 目前尚未支持。
BlockDirRTL 目前尚未支持。
Bold 切换当前选中区的粗体显示与否。
BrowseMode 目前尚未支持。
Copy 将当前选中区复制到剪贴板。
CreateBookmark 创建一个书签锚或获取当前选中区或插入点的书签锚的名称。
CreateLink 在当前选中区上插入超级链接,或显示一个对话框允许用户指定要为当前选中区插入的超级链接的 URL。
Cut 将当前选中区复制到剪贴板并删除之。
Delete 删除当前选中区。
DirLTR 目前尚未支持。
DirRTL 目前尚未支持。
EditMode 目前尚未支持。
FontName 设置或获取当前选中区的字体。
FontSize 设置或获取当前选中区的字体大小。
ForeColor 设置或获取当前选中区的前景(文本)颜色。
FormatBlock 设置当前块格式化标签。
Indent 增加选中文本的缩进。
InlineDirLTR 目前尚未支持。
InlineDirRTL 目前尚未支持。
InsertButton 用按钮控件覆盖当前选中区。
InsertFieldset 用方框覆盖当前选中区。
InsertHorizontalRule 用水平线覆盖当前选中区。
InsertIFrame 用内嵌框架覆盖当前选中区。
InsertImage 用图像覆盖当前选中区。
InsertInputButton 用按钮控件覆盖当前选中区。
InsertInputCheckbox 用复选框控件覆盖当前选中区。
InsertInputFileUpload 用文件上载控件覆盖当前选中区。
InsertInputHidden 插入隐藏控件覆盖当前选中区。
InsertInputImage 用图像控件覆盖当前选中区。
InsertInputPassword 用密码控件覆盖当前选中区。
InsertInputRadio 用单选钮控件覆盖当前选中区。
InsertInputReset 用重置控件覆盖当前选中区。
InsertInputSubmit 用提交控件覆盖当前选中区。
InsertInputText 用文本控件覆盖当前选中区。
InsertMarquee 用空字幕覆盖当前选中区。
InsertOrderedList 切换当前选中区是编号列表还是常规格式化块。
InsertParagraph 用换行覆盖当前选中区。
InsertSelectDropdown 用下拉框控件覆盖当前选中区。
InsertSelectListbox 用列表框控件覆盖当前选中区。
InsertTextArea 用多行文本输入控件覆盖当前选中区。
InsertUnorderedList 切换当前选中区是项目符号列表还是常规格式化块。
Italic 切换当前选中区斜体显示与否。
JustifyCenter 将当前选中区在所在格式化块置中。
JustifyFull 目前尚未支持。
JustifyLeft 将当前选中区所在格式化块左对齐。
JustifyNone 目前尚未支持。
JustifyRight 将当前选中区所在格式化块右对齐。
LiveResize 迫使 MSHTML 编辑器在缩放或移动过程中持续更新元素外观,而不是只在移动或缩放完成后更新。
MultipleSelection 允许当用户按住 Shift 或 Ctrl 键时一次选中多于一个站点可选元素。
Open 目前尚未支持。
Outdent 减少选中区所在格式化块的缩进。
OverWrite 切换文本状态的插入和覆盖。
Paste 用剪贴板内容覆盖当前选中区。
PlayImage 目前尚未支持。
Print 打开打印对话框以便用户可以打印当前页。
Redo 目前尚未支持。
Refresh 刷新当前文档。
RemoveFormat 从当前选中区中删除格式化标签。
RemoveParaFormat 目前尚未支持。
SaveAs 将当前 Web 页面保存为文件。
SelectAll 选中整个文档。
SizeToControl 目前尚未支持。
SizeToControlHeight 目前尚未支持。
SizeToControlWidth 目前尚未支持。
Stop 目前尚未支持。
StopImage 目前尚未支持。
StrikeThrough 目前尚未支持。
Subscript 目前尚未支持。
Superscript 目前尚未支持。
UnBookmark 从当前选中区中删除全部书签。
Underline 切换当前选中区的下划线显示与否。
Undo 目前尚未支持。
Unlink 从当前选中区中删除全部超级链接。
Unselect 清除当前选中区的选中状态。
document.ExecCommand() – html实例
<HTML> <HEAD> <TITLE>JavaScript--execCommand指令集</TITLE> <SCRIPT LANGUAGE="javascript"> <!-- /* *该function执行copy指令 */ function fn_doufucopy(){ edit.select(); document.execCommand('Copy'); } /* *该function执行paste指令 */ function fn_doufupaste() { tt.focus(); document.execCommand('paste'); } /* *该function用来创建一个超链接 */ function fn_creatlink() { document.execCommand('CreateLink',true,'true');//弹出一个对话框输入URL //document.execCommand('CreateLink',false,'http://www.51js.com'); } /* *该function用来将选中的区块设为指定的背景色 */ function fn_change_backcolor() { document.execCommand('BackColor',true,'#FFbbDD');//true或false都可以 } /* *该function用来将选中的区块设为指定的前景色,改变选中区块的字体大小,改变字体,字体变粗变斜 */ function fn_change_forecolor() { //指定前景色 document.execCommand('ForeColor',false,'#BBDDCC');//true或false都可以 //指定背景色 document.execCommand('FontSize',false,7); //true或false都可以 //字体必须是系统支持的字体 document.execCommand('FontName',false,'标楷体'); //true或false都可以 //字体变粗 document.execCommand('Bold'); //变斜体 document.execCommand('Italic'); } /* *该function用来将选中的区块加上不同的线条 */ function fn_change_selection() { //将选中的文字加下划线 document.execCommand('Underline'); //在选中的文字上划粗线 document.execCommand('StrikeThrough'); //将选中的部分文字变细 document.execCommand('SuperScript'); //将选中区块的下划线取消掉 document.execCommand('Underline'); } /* *该function用来将选中的区块排成不同的格式 */ function fn_format() { //有序列排列 document.execCommand('InsertOrderedList'); //实心无序列排列 document.execCommand('InsertUnorderedList'); //空心无序列排列 document.execCommand('Indent'); } /* *该function用来将选中的区块剪下或是删除掉 */ function fn_CutOrDel() { //删除选中的区块 //document.execCommand('Delete'); //剪下选中的区块 document.execCommand('Cut'); } /* *该function用来将选中的区块重设为一个相应的物件 */ function fn_InsObj() { /* ****************************************** * 以下指令都是为选中的区块重设一个object; * 如没有特殊说明,第二个参数true或false是一样的; * 参数三表示为该object的id; * 可以用在javascript中通过其指定的id来控制它 ****************************************** */ /*重设为一个button(InsertButton和InsertInputButtong一样, 只不前者是button,后者是input)*/ /*document.execCommand('InsertButton',false,"aa"); //true或false无效 document.all.aa.value="风舞九天";*/ //重设为一个fieldset /*document.execCommand('InsertFieldSet',true,"aa"); document.all.aa.innerText="刀剑如梦";*/ //插入一个水平线 //document.execCommand('InsertHorizontalRule',true,"aa"); //插入一个iframe //document.execCommand('InsertIFrame',true,"aa"); //插入一个InsertImage,设为true时需要图片,false时不需图片 //document.execCommand('InsertImage',false,"aa"); //插入一个checkbox //document.execCommand('InsertInputCheckbox',true,"aa"); //插入一个file类型的object //document.execCommand('InsertInputFileUpload',false,"aa"); //插入一个hidden /*document.execCommand('InsertInputHidden',false,"aa"); alert(document.all.aa.id);*/ //插入一个InputImage /*document.execCommand('InsertInputImage',false,"aa"); document.all.aa.src="F-a10.gif";*/ //插入一个Password //document.execCommand('InsertInputPassword',true,"aa"); //插入一个Radio //document.execCommand('InsertInputRadio',false,"aa"); //插入一个Reset //document.execCommand('InsertInputReset',true,"aa"); //插入一个Submit //document.execCommand('InsertInputSubmit',false,"aa"); //插入一个input text //document.execCommand('InsertInputText',false,"aa"); //插入一个textarea //document.execCommand('InsertTextArea',true,"aa"); //插入一个 select list box //document.execCommand('InsertSelectListbox',false,"aa"); //插入一个single select document.execCommand('InsertSelectDropdown',true,"aa"); //插入一个line break(硬回车??) //document.execCommand('InsertParagraph'); //插入一个marquee /*document.execCommand('InsertMarquee',true,"aa"); document.all.aa.innerText="bbbbb";*/ //用于取消选中的阴影部分 //document.execCommand('Unselect'); //选中页面上的所有元素 //document.execCommand('SelectAll'); } /* *该function用来将页面保存为一个文件 */ function fn_save() { //第二个参数为欲保存的文件名 document.execCommand('SaveAs','mycodes.txt'); //打印整个页面 //document.execCommand('print'); } --> </SCRIPT> </HEAD> <body> <input id="edit" value="范例" NAME="edit"><br> <button onclick="fn_doufucopy()" ID="Button1">Copy</button> <button onclick="fn_doufupaste()" ID="Button2"> paste</button><br> <textarea id="tt" rows="10" cols="50" NAME="tt"></textarea> <hr> <br> 浮沉聚散变化又再,但是总可卷土重来.<br> 天若有情天亦老,人间正道是沧桑.<br> 都怪我,太执着,却也等不到花开叶落.<br> <br> Please select above letters, then click following buttons:<br> <hr> <input type="button" value="创建CreateLink" onclick="fn_creatlink()" ID="Button3" NAME="Button3"><br> <input type="button" value="改变文字背景色" onclick="fn_change_backcolor()" ID="Button4" NAME="Button4"><br> <input type="button" value="改变文字前景色" onclick="fn_change_forecolor()" ID="Button5" NAME="Button5"><br> <input type="button" value="给文字加线条" onclick="fn_change_selection()" ID="Button6" NAME="Button6"><br> <input type="button" value="改变文字的排列" onclick="fn_format()" ID="Button7" NAME="Button7"><br> <input type="button" value="删除或剪下选中的部分" onclick="fn_CutOrDel()" ID="Button8" NAME="Button8"><br> <input type="button" value="插入Object" onclick="fn_InsObj()" ID="Button9" NAME="Button9"><br> <input type="button" value="保存或打印文件" onclick="fn_save()" ID="Button10" NAME="Button10"><br> <input type="button" value="测试Refresh属性" onclick="document.execCommand('Refresh')" ID="Button11" NAME="Button11"> </body> </HTML>