JavaScript-阿里云开发者社区

开发者社区> 杨振平> 正文

JavaScript

简介: JavaScript 是什么? 一、 JavaScript 是一种新的描述语言,此一语言可以被钳入HTML 的文件之中。 透过JavaScript 可以做到回应使用者的需求事件(如: form 的输入) 而不用任何的网路来回传输资料,所以当一位使用者输入一项资料时, 它不用经过传给伺服端(server)处理,再传回来的过程,而直接可以被客户端(client) 的应用程式所处理。
+关注继续查看

JavaScript 是什么?
一、 JavaScript 是一种新的描述语言,此一语言可以被钳入HTML 的文件之中。
透过JavaScript 可以做到回应使用者的需求事件(如: form 的输入) 而不用任何的网路来回传输资料,所以当一位使用者输入一项资料时,
它不用经过传给伺服端(server)处理,再传回来的过程,而直接可以被客户端(client) 的应用程式所处理。你也可以想像成有一个可执行程式在你的客端上执行一样!
目前已有一些写好的程式在Internet 上你可以连过去看看,以下有一些计算器的例子,在Nescape 上。
JavaScript 和Java 很类似,但到底并不一样! Java 是一种比JavaScript 更复杂许多的程式语言,而JavaScript 则是相当容易了解的语言。
JavaScript 创作者可以不那么注重程式技巧,所以许多Java 的特性在Java Script 中并不支援。
function getname(str) {
    alert("哈罗! "+ str+"!");
 }
<input type="text" name="name" onBlur="getname(this.value)" value="">
document.write(document.lastModified)
function hello() {
       alert("哈罗!");
}
<a href="" onMouseOver="hello()">link</a>
function RandomNumber() {
       timenow=new Date();
       num=Math.abs(Math.sin(timenow.getHours()*timenow.getMinutes()*timenow.getSeconds()));
       return num;
     }
     function WinOpen() {
       msg=open("","DisplayWindow","toolbar=no,directories=no,menubar=no");
       msg.document.write("<HEAD><TITLE>哈罗!</TITLE></HEAD>");
       msg.document.write("<CENTER><H1>酷毙了!</H1><h2>这是<B>JavaScript</B>所开的视窗!</h2></CENTER>");
     }
today = new Date()
document.write("现在时间是: ",today.getHours(),":",today.getMinutes())
document.write("<br>今天日期为: ", today.getMonth()+1,"/",today.getDate(),"/",today.getYear());

function RandomNumber() {
  today = new Date();
  num = Math.abs(Math.sin(today.getTime()));
  return num;
}
document.write("This is a random number:", RandomNumber());
<INPUT type="button" name="Button1" value="Push me" onclick="WinOpen()">
二 、框架
1 、<FRAMESET ROWS="50%,50%">
    <FRAME SRC="frtest1.html" name="fr1">
    <FRAME SRC="frtest2.html" name="fr2">
  </FRAMESET>

2、 <FRAMESET COLS="50%,50%">
  <FRAMESET ROWS="50%,50%">
    <FRAME SRC="cell.html">
    <FRAME SRC="cell.html">
  </FRAMESET>

  <FRAMESET ROWS="33%,33%,33%">
    <FRAME SRC="cell.html">
    <FRAME SRC="cell.html">
    <FRAME SRC="cell.html">
  </FRAMESET>

</FRAMESET>

3、 <HTML>
<HEAD>
<title>Frames</title>
</HEAD>
    <FRAMESET ROWS="50%,50%">
    <FRAME SRC="frame1.html" name="fr1" noresize>
    <FRAME SRC="frame2.html" name="fr2">
  </FRAMESET>

</HTML>
以下是 frame1.html 的原始码:
<HTML>
<HEAD>
<script language="JavaScript">
<!-- Hiding
     function hi() {
       document.write("嗨!<br>");
     }
     function yo() {
       document.write("呦!<br>");
     }
     function bla() {
       document.write("啦 啦 啦<br>");
     }
// -->
</script>
</HEAD>
<BODY>
这是第一个 frame!
</BODY>
</HTML>
以下是 frame2.html 的原始码:
<HTML>
<body>
这是第二个 frame!
<p>
<FORM NAME="buttonbar">
     <INPUT TYPE="button" VALUE="嗨" onClick="parent.fr1.hi()">
     <INPUT TYPE="button" VALUE="呦" onClick="parent.fr1.yo()">
     <INPUT TYPE="button" VALUE="啦" onCLick="parent.fr1.bla()">
</FORM>
</BODY>
</HTML>
三 、状态栏
<html>
<head>
<script language="JavaScript">
<!-- Hide
function statbar(txt) {
   window.status = txt;
}
// -->
</script>
</head>
<body>
<form>
<input type="button" name="look" value="写入文字" onclick="statbar('嗨! 这就是状态列(statusbar) !');">
<input type="button" name="erase" value="清除文字" onclick="statbar('');">
</form>
</body>
</html>


<html>
<head>
<script language="JavaScript">
<!-- Hide
function moveover(txt) {
   window.status = txt;
   setTimeout("erase()",1000);
}
function erase() {
   window.status="";
}
// -->
</script>
</head>
<body>
<a href="dontclck.html" onMouseOver="moveover('瞬间即逝!');return true;">
link</a>
</body>
</html>


<html>
<head>
<script language="JavaScript">
<!-- Hide
var scrtxt="怎么样! 很酷吧! 您也可以试试."+"Here goes your message the visitors to your page will "+"look at for hours in pure fascination...";
var lentxt=scrtxt.length;
var width=100;
var pos=1-width;
function scroll() {
  pos++;
  var scroller="";
  if (pos==lentxt) {
    pos=1-width;
  }
  if (pos<0) {
    for (var i=1; i<=Math.abs(pos); i++) {
      scroller=scroller+" ";}
    scroller=scroller+scrtxt.substring(0,width-i+1);
  }
  else {
    scroller=scroller+scrtxt.substring(pos,width+pos);
  }
  window.status = scroller;
  setTimeout("scroll()",150);
  }
//-->
</script>
</head>
<body onLoad="scroll();return true;">
这里可显示您的网页 !
</body>
</html>
四 、数组
function initArray() {
      this.length = initArray.arguments.length
      for (var i = 0; i < this.length; i++)
      this[i+1] = initArray.arguments[i]
   }
function stat(txt) {
        window.status = txt;
        setTimeout("erase()",1500);
      }
     function erase() {
       window.status="";
     }
var Mixedup= new initArray(17,"yo",103);
  document.write("Element No. 1: "+Mixedup[1]+"<br>");
  document.write("Element No. 2: "+Mixedup[2]+"<br>");
  document.write("Element No. 3: "+Mixedup[3]+"<br>");
一个清除视窗或frame中内容的好方法,您可以试试:
<P>
<PRE>
     document.close();
     document.open();
     document.write("<P>");
</PRE>
<P>
<FORM NAME="buttonbar">
     <INPUT TYPE="button" VALUE="Back" onClick="history.back()">
     <INPUT TYPE="button" VALUE="百度" onClick="location='http://www.baidu.com'">
     <INPUT TYPE="button" VALUE="Next" onCLick="history.forward()">
</FORM>
<H4>
<A href="script.htm" tppabs="http://www.baidu.com" onMouseOver="stat('回到主页'); return true">回主页</A> -
</H4>
五 、同时载入两个页面
frames2.html
<HTML>
<HEAD>
<title>Frames</title>
</HEAD>
    <FRAMESET COLS="295,*">
  <FRAMESET ROWS="100%,*">
    <FRAME SRC="loadtwo.html" NAME="fr1">
      </FRAMESET>
  <FRAMESET ROWS="75%,25%">
    <FRAME SRC="cell.html" NAME="fr2">
    <FRAME SRC="cell.html" NAME="fr3">
      </FRAMESET>
</FRAMESET>
</HTML>
第一个frame 会载入loadtwo.html 并产生一个按钮 :
loadtwo.html
<HTML>
<HEAD>
<script language="JavaScript">
<!-- Hiding
  function loadtwo(page2, page3) {
     parent.fr2.location.href=page2;
     parent.fr3.location.href=page3;
}
// -->
</script>
</HEAD>
<BODY>
<FORM NAME="buttons">
     <INPUT TYPE="button" VALUE="同时载入两份文件" onClick="loadtwo('frtest1.html',
     'frtest2.html')">
</FORM>
</BODY>
</HTML>

<a href="javascript:myfunction()">My Link</a>

<a href="getfr2.html" target="fr2">
<BODY onLoad="parent.fr3.location.href='getfr3.html'; return true;">
<a href="goanywhere.html" target="Resource Window">Go!</a>

六 、表格动作
<html>
<head>
<script language="JavaScript">
<!-- Hide

function test1(form) {
  if (form.text1.value == "")
    alert("您没写上任何东西, 请再输入一次!")
  else {
   alert("嗨"+form.text1.value+"! 您已输入完成!");
  }
}

function test2(form) {
  if (form.text2.value == "" ||
      form.text2.value.indexOf('@', 0) == -1)
        alert("这不是正确的e-mail address! 请再输入一次!");
  else alert("您 已 输 入 完 成 !");
}
// -->
</script>
</head>

<body>
<form name="first">
Enter your name:<br>
<input type="text" name="text1">
<input type="button" name="button1" value="输入测试" onClick="test1(this.form)">
<P>
Enter your e-mail address:<br>
<input type="text" name="text2">
<input type="button" name="button2" value="输入测试" onClick="test2(this.form)">
</body>

<FORM METHOD=POST ACTION="mailto:your_email@goes.here">
<H3>您 喜 欢 我 的 网 页 吗 ?</H3>
  <INPUT NAME="choice" TYPE="RADIO" VALUE="1">一点也不喜欢。 <BR>
  <INPUT NAME="choice" TYPE="RADIO" VALUE="2" CHECKED>简直浪费我的时间。 <BR>
  <INPUT NAME="choice" TYPE="RADIO" VALUE="3">这简直是Net 上最烂的站台。 <BR>
  <INPUT NAME="submit" TYPE="SUBMIT" VALUE="Send">
</FORM>

function setfocus() {
        document.first.text1.focus();
        return;
}
<body onLoad="setfocus()">

七、JavaScript的对象
The、following、objects、are、available、in、JavaScript:、anchor、applet、button、checkbox、Date、document、orm、history、link、location、Math、password、radioButton、reset、selection、string、submit、text 、textArea、window

JavaScript的对象属性
以下的属性可在、JavaScript中用到:
action、alinkColor、anchors、bgColor、checked、current、defaultChecked、defaultSelected、defaultStatus、defaultValue、E、elements、fgColor、forms、frames、hash、host、hostname、href、index、lastModified、length、linkColor、links、LN2、 LN10、loadedDate、location、method、name、options、parent、pathname、PI、port、protocol、referrer、search、selected、selectedIndex、self、SQRT1_2、SQRT2、status、target、text、title、top、value、vlinkColor、 window

JavaScript的方法
以下的一些"方法"可用在JavaScript:
abs、acos、alert、anchor、asin、assign、atan、back、big、blink、blur、bold、ceil、charAt、clear、clearTimeout、click、close、confirm、cos、eval、exp、fixed、floor、focus、 fontcolor、fontsize、forward、getDate、getDay、getHours、getMinutes、getMonth、getSeconds、getTime、getTimeZoneoffset、getYear、go、indexOf、italics、lastIndexOf、link、log、max、min、open、parse、pow、prompt、random、 round、select、setDate、setHours、setMinutes、setMonth、setSeconds、setTimeout、setTime、setYear、sin、small、sqrt、strike、sub、submit、substring、sup、tan、toGMTString、toLocaleString、toLowerCase、toString、toUpperCase、UTC、 write、writeln

事件处理
以下的事件可由、JavaScript、发生:
onBlur、onChange、onClick、onFocus、onLoad、onMouseOver、onSelect、onSubmit、onUnload、

JavaScript的语法
The、following、statements、are、available、in、JavaScript:、break、comment、continue、for、for...in、function、、if...else、return、var、while、with

Javascript的保留字
以下的保留字不可以用作变量,函数名,对象名等,其中有的保留字是为以后JAVASCRIPT扩展用的
abstract、boolean、break、byte、case、catch、char、class、const、continue、default、do、double、else、extends、false、final、finally、float、for、function、goto、if、implements、import、 in、instanceof、int、interface、long、native、new、null、package、private、protected、public、return、short、static、super、switch、synchronized、this、throw、throws、transient、true、try、var、 void、while、、with

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
9492 0
阿里云服务器ECS远程登录用户名密码查询方法
阿里云服务器ECS远程连接登录输入用户名和密码,阿里云没有默认密码,如果购买时没设置需要先重置实例密码,Windows用户名是administrator,Linux账号是root,阿小云来详细说下阿里云服务器远程登录连接用户名和密码查询方法
11206 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,阿里云优惠总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系.
13176 0
windows server 2008阿里云ECS服务器安全设置
最近我们Sinesafe安全公司在为客户使用阿里云ecs服务器做安全的过程中,发现服务器基础安全性都没有做。为了为站长们提供更加有效的安全基础解决方案,我们Sinesafe将对阿里云服务器win2008 系统进行基础安全部署实战过程! 比较重要的几部分 1.
9052 0
腾讯云服务器 设置ngxin + fastdfs +tomcat 开机自启动
在tomcat中新建一个可以启动的 .sh 脚本文件 /usr/local/tomcat7/bin/ export JAVA_HOME=/usr/local/java/jdk7 export PATH=$JAVA_HOME/bin/:$PATH export CLASSPATH=.
4620 0
如何设置阿里云服务器安全组?阿里云安全组规则详细解说
阿里云安全组设置详细图文教程(收藏起来) 阿里云服务器安全组设置规则分享,阿里云服务器安全组如何放行端口设置教程。阿里云会要求客户设置安全组,如果不设置,阿里云会指定默认的安全组。那么,这个安全组是什么呢?顾名思义,就是为了服务器安全设置的。安全组其实就是一个虚拟的防火墙,可以让用户从端口、IP的维度来筛选对应服务器的访问者,从而形成一个云上的安全域。
7385 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,云吞铺子总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系统盘、创建快照、配置安全组等操作如何登录ECS云服务器控制台? 1、先登录到阿里云ECS服务器控制台 2、点击顶部的“控制台” 3、通过左侧栏,切换到“云服务器ECS”即可,如下图所示 通过ECS控制台的远程连接来登录到云服务器 阿里云ECS云服务器自带远程连接功能,使用该功能可以登录到云服务器,简单且方便,如下图:点击“远程连接”,第一次连接会自动生成6位数字密码,输入密码即可登录到云服务器上。
21903 0
+关注
杨振平
杨振平,CSDN云计算博客专家,微软多个开源项目的Committer和Contributor,精通微软私有云和公有云,System Center Orchestrator源码级专家,开有Redis,Memcached,WebRTC等网络课程,目前在微创软件负责开源和云计算的项目。
577
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载