当前位置: 代码迷 >> JavaScript >> J2EE复习(三)JavaScript(下)-基础入门
  详细解决方案

J2EE复习(三)JavaScript(下)-基础入门

热度:224   发布时间:2012-11-23 00:03:43.0
J2EE复习(三)JavaScript(上)--基础入门

就我个人在学习和使用JavaScript过程中,感觉该语言逻辑很混乱,有时会出现莫名其妙的错误,并且没有很好的开发工具,调试起来很是费神费时,然而在web开发中JavaScript充当着很重要的角色,令我很是苦恼,希望可以通过长期的学习和编码积累经验从而得到进步。

JavaScript简介
JavaScript是一种基于对象的脚本语言,用于开发基于客户端和基于服务器的Internet应用程序
可用于创建客户端脚本和服务器端脚本
由Sun Microsystems 和 Netscape 开发,是从 Netscapes 的 Livescript 发展而来的

JavaScript数据类型
数字型 (Number)                    整数或实数
逻辑型或布尔型 (boolean)      true或false
字符串型(String)                    如“Hello World”,“123.4”
空型 (null)                            表示空值的特殊关键字

算术运算符
加+   减-  乘*  除/   取余% 一元递增++ 一元递减--

比较运算符
等于:==  全等:===  不等:!=   大于:>  大于等于:>=  小于:<  小于等于:<=
PS:全等=== 比较的是数据类型和值,只有两个都相等时才返回true。

逻辑运算符
逻辑与:&&   逻辑或:||    逻辑非:!
PS:JavaScript中没有&逻辑运算符

条件运算符:(condition) ? trueVal : falseVal ;例子:status = (age >= 18) ? "adult" : "minor"
typeof运算符:typeof 运算符返回字符串,该字符串代表操作数的类型;

JavaScript数组
有两种向数组赋值的方法(你可以添加任意多的值,就像你可以定义你需要的任意多的变量一样)。

var mycars=new Array();
mycars[0]="Saab";
mycars[1]="Volvo";
mycars[2]="BMW";

也可以使用一个整数自变量来控制数组的容量:

var mycars=new Array(3);
mycars[0]="Saab";
mycars[1]="Volvo";
mycars[2]="BMW";

还有一种定义方式

var mycars=new Array("Saab","Volvo","BMW");

在访问数组是同java一样的,mycars[0],下标也是从0开始。
数组方法和属性
使用concat() 方法来合并两个数组。
使用join() 方法将数组的所有元素组成一个字符串。
使用sort() 方法从字面上或数值上对数组进行排序。
JavaScript数组也有length属性

JavaScript多维数组

MyArray = new Array(5,5);
MyArray[0, 0] = "Ryan Dias";
MyArray[0, 1] = 1;
MyArray[1, 0] = "Mike Donne";
MyArray[1, 1] = 2;

JavaScript try...catch throw使用

<html>
<body>
<script type="text/javascript">
var x=prompt("Enter a number between 0 and 10:","")
try
{ 
if(x>10) 
throw "Err1";
else if(x<0)
throw "Err2";
} 
catch(er)
{
if(er=="Err1") 
alert("Error! The value is too high");
if(er == "Err2") 
alert("Error! The value is too low"); 
}
</script>
</body>
</html>

 如果 x 的值大于 10 或者小于 0,错误就会被抛出 (throw)。这个错误被 catch 的参数捕获后,就会显示出自定义的出错信息。

JavaScript   for...in语句使用
for … in语句用于在对象的各个属性,或数组的各个元素之间循环

<HTML>
  <BODY>
     <SCRIPT LANGUAGE = "JavaScript">
       color = new Array("红色","蓝色","绿色");    
       for (var prop in color){
         var record = "color " ;
         record+=prop+"="+color[prop] + "<BR>";
         document.write(record);
       }
    </SCRIPT>
  </BODY>
</HTML>

JavaScript   new语句使用
new操作符用于新建对象类型实例。

<HTML>
    <BODY>
        <SCRIPT LANGUAGE="JavaScript">
        function employee(name, code, designation) {
            this.name = name
            this.code = code
            this.designation = designation
        }
        newemp = new employee("John Dias", "A001", "职员");
        document.write("雇员姓名:" + newemp.name + "<BR>");
        document.write("雇员代号:" + newemp.code + "<BR>");
        document.write("头衔:" + newemp.designation);
        </SCRIPT>
    </BODY>
</HTML>

JavaScript  with语句使用
with语句用于执行一组语句,所有这些语句都假定引用指定的对象。

<HTML>
    <BODY>
        <SCRIPT LANGUAGE ="JavaScript">
             var a, b, c;
            var r=10;
        with (Math)  {
              a = PI * r * r;
              b = r * cos(PI);
              c = r * sin(PI/2);
           }
           document.write (a +"<BR>");
           document.write (b +"<BR>");
           document.write (c +"<BR>");
        </SCRIPT>
    </BODY>
</HTML>

JavaScript 字符串对象
字符串对象示例

<HTML>
  <BODY>
   <script language = "Javascript">
    var bstr = "大号";
    var sstr = "小号";
    var blstr = "粗体";
    var blkstr = “闪烁”;
    var ucase = "大写";
    var lcase = "小写";
    document.write ("<BR>这是"+ bstr.big() + "文本");
     document.write ("<BR>这是"+ sstr.small() +"文本");
     document.write ("<BR>这是"+ blstr.bold() + "文本");
     document.write ("<BR>这是"+ blkstr.blink() + "文本");
     document.write ("<BR>这是"+ ucase.toUpperCase() + "文本");
     document.write ("<BR>这是"+ lcase.toLowerCase() + "文本");
  </script>
 </BODY>
</HTML>

 字符串左右两端空格处理方法

<html>
<head>
<title>js String Object</title>
<script language="javascript">
//此处为string类添加三个成员 
String.prototype.Trim = function(){ return Trim(this);} 
String.prototype.LTrim = function(){return LTrim(this);} 
String.prototype.RTrim = function(){return RTrim(this);} 

//此处为独立函数 
function LTrim(str)//去除左边空格
{ 
var i; 
for(i=0;i<str.length;i++) 
{ 
if(str.charAt(i)!=" "&&str.charAt(i)!=" ")break; 
} 
str=str.substring(i,str.length); 
return str; 
} 
function RTrim(str)//去除右边空格
{ 
var i; 
for(i=str.length-1;i>=0;i--) 
{ 
if(str.charAt(i)!=" "&&str.charAt(i)!=" ")break; 
} 
str=str.substring(0,i+1); 
return str; 
} 
function Trim(str)//去除左右两边空格
{ 
return LTrim(RTrim(str)); 
}
</script>
<head>
<body>
<script>alert("    string         ".LTrim(this).length);</script>
<script>alert("    string         ".RTrim(this).length);</script>
<script>alert("    string         ".Trim(this).length);</script>
</body>
</html>

 JavaScript RegExp(正则表达式)对象

/**语法1 re = new RegExp("pattern",["flags"]);
  语法2 re = /pattern/[flags];
  可选项。如果使用语法 2 要用引号将 flag 引起来。标志可以组合使用,可用的有: 
  g (全文查找出现的所有 pattern) 
  i (忽略大小写) 
  m (多行查找)*/

var pattern1 = new RegExp("e","g");
var pattern2 = new RegExp(/^[1-9]\d*$/);
var pattern3 = /^[1-9]\d*$/;

 RegExp 对象有 3 个方法:test()、exec() 以及 compile()。
test() 方法检索字符串中的指定值。返回值是 true 或 false,一般在检查字符串的合法性时使用,如检查输入值是否为正浮点数。
exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。
compile() 方法用于改变 RegExp,如果不太清楚请看下面的例子。

<html>
<body>
<script type="text/javascript">
function CompileDemo(){
   var rs;
   var s = "AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPp";
   // 只为大写字母创建正则表达式。
   var r = new RegExp("[A-Z]", "g");
   var a1 = s.match(r);              // 查找匹配。
   // 只为小写字母编译正则表达式。
   r.compile("[a-z]", "g");
   var a2 = s.match(r);              // 查找匹配。
   return(a1 + "\n" + a2);
}
alert(CompileDemo());
</script>
</body>
</html>

JavaScript---获取事件信息
JavaScript中:window.event或event对象获取事件信息调用其keyCode获取按键的键位号
event.keyCode ---- 返回对应键位的值
event.shiftKey ---- 如果触动了shift键则返回true
event.ctrlKey ---- 如果触动了ctrl键则返回true
event.altKey ---- 如果触动了alt键则返回true

HTML事件
onClick  ---单击事件
ondblclick---鼠标双击
onMouseDown  --- 鼠标按下
onMouseUp---鼠标弹起
oncontextmenu---鼠标右击
onChange --- 值改变事件
onFocus  --- 获取焦点
onBlur  --- 失去焦点
onMouseOver---鼠标移动
onMouseOut  ---鼠标离开
onLoad  ---加载事件
onSubmit  ---提交事件


Navigator 对象的属性
appCodeName 返回浏览器的代码名。
appMinorVersion 返回浏览器的次级版本。
appName 返回浏览器的名称。
appVersion 返回浏览器的平台和版本信息
browserLanguage 返回当前浏览器的语言。
cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值。
cpuClass 返回浏览器系统的 CPU 等级。
onLine 返回指明系统是否处于脱机模式的布尔值。 
platform 返回运行浏览器的操作系统平台。

Navigator 对象的方法
javaEnabled() 规定浏览器是否启用 Java。

Window对象的属性:
closed 返回窗口是否已被关闭。
defaultStatus 设置或返回窗口状态栏中的默认文本。
document 对 Document 对象的只读引用。
history 对 History 对象的只读引用。
length 设置或返回窗口中的框架数量。
location 用于窗口或框架的Location 对象。
name 设置或返回窗口的名称。
Navigator 对 Navigator 对象的只读引用。
opener 返回对创建此窗口的窗口的引用。
outerheight 返回窗口的外部高度。
outerwidth 返回窗口的外部宽度。
parent 返回父窗口。
Screen 对 Screen 对象的只读引用。
self 返回对当前窗口的引用。等价于 Window 属性。
status 设置窗口状态栏的文本。
top 返回最顶层的先辈窗口。
window window 属性等价于 self 属性,它包含了对窗口自身的引用。

Window对象的方法:
alert(信息字串) 弹出警告信息
confirm(信息字串) 显示确认信息对话框
prompt(提示字串[,默认值]) 显示提示信息,并提供可输入的字段
atob(译码字串) 对base-64编码字串进行译码
btoa(字串) 将进行base-64编码
back() 回到历史记录的上一网页
forward() 加载历史记录中的下一网页
open(URL,窗口名称[,窗口规格])
close()
focus() 焦点移到该窗口
blur() 窗口转成背景
stop() 停止加载网页  
enableExternalCapture()    允许有框架的窗口获取事件
disableExternalCapture()   关闭enableExternalCapture()
captureEvents(事件类型)    捕捉窗口的特定事件
routeEvent(事件)           传送已捕捉的事件
handleEvent(事件)          使特定事件的处理生效
releaseEvents(事件类型)    释放已获取的事件
moveBy(水平点数,垂直点数) 相对定位
moveTo(x坐标,y坐标)       绝对定位  
home()   进入浏览器设置的主页
find([字串[,caseSensitivr,backward]]) 查找窗口中特定的字串
print()   打印当前窗口的内容。
setHotKeys(true|false) 激活或关闭组合键
setZOptions() 设置窗口重叠时的堆栈顺序
setInterval(表达式,毫秒)  
setTimeout(表达式,毫秒)  
clearInterval(定时器对象)  
clearTimeout(定时器对象)
showModalDialog() 弹出模态窗体,通过window.dialogArguments获取父窗体传过来的值,通过window.returnValue给父窗体传值。


Document 对象的属性
body 提供对 <body> 元素的直接访问。对于定义了框架集的文档,该属性引用最外层的 <frameset>。        
cookie 设置或返回与当前文档有关的所有 cookie。
domain 返回当前文档的域名。
lastModified 返回文档被最后修改的日期和时间。
referrer 返回载入当前文档的文档的 URL。
title 返回当前文档的标题。
URL 返回当前文档的 URL。

Document 对象的方法
close() 关闭用 document.open() 方法打开的输出流,并显示选定的数据。
getElementById() 返回对拥有指定 id 的第一个对象的引用。
getElementsByName() 返回带有指定名称的对象集合。
getElementsByTagName() 返回带有指定标签名的对象集合。
open() 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。
write() 向文档写 HTML 表达式 或 JavaScript 代码。
writeln() 等同于 write() 方法,不同的是在每个表达式之后写一个换行符。

 

Location 对象的属性
hash 设置或返回从井号 (#) 开始的 URL(锚)。
host 设置或返回主机名和当前 URL 的端口号。
hostname 设置或返回当前 URL 的主机名。
href 设置或返回完整的 URL。
pathname 设置或返回当前 URL 的路径部分。
port 设置或返回当前 URL 的端口号。
protocol 设置或返回当前 URL 的协议。
search 设置或返回从问号 (?) 开始的 URL(查询部分)。

Location 对象的方法
assign() 加载新的文档。
reload() 重新加载当前文档。
replace() 用新的文档替换当前文档。

History 对象的属性
length 返回浏览器历史列表中的 URL 数量

History 对象的方法
back() 加载 history 列表中的前一个 URL
forward() 加载 history 列表中的下一个 URL
go() 加载 history 列表中的某个具体页面

1 楼 qq68547854 2009-04-16  
up up up !
2 楼 fcu 2009-05-19  
楼主辛苦了,收藏
3 楼 hlbng 2009-05-21  
很基础的东西,收藏了
  相关解决方案