菜鸟javascript基础整理1

  1

  

复制代码 代码如下:

  //页面中写入html内容

  document.write("<h1>Hello World!</h1>")

  2

  

复制代码 代码如下:

  //为了防止不支持 JavaScript 的浏览器把js当作为页面的内容来显示

  //注释行末尾的两个正斜杠是 JavaScript 的注释符号,它会阻止 JavaScript 编译器对这一行的编译。

  <script type="text/javascript">

  <!--

  document.write("Hello World!");

  //-->

  </script>

  3

  

复制代码 代码如下:

  //onload事件的多种写法

  //第一种通过body标签加入onload事件

  <script type="text/javascript">

  function message(){ alert("该提示框是通过 onload 事件调用的。");}

  </script>

  <body onload="message()">

  //第二种直接用window函数调用onload事件

  <script type="text/javascript" language="javascript">

  window.onload=message;

  function message(){ alert("该提示框是通过 onload 事件调用的。"); }

  </script>

  4

  //JavaScript 放置的位置

  当页面载入时,会执行位于 body 部分的 JavaScript。(直接执行)

  当被调用时,位于 head 部分的 JavaScript 才会被执行。

  head 部分

  包含函数的脚本位于文档的 head 部分。这样我们就可以确保在调用函数前,脚本已经载入了。

  5.

  //分号的作用

  //分号是可选的(根据 JavaScript 标准),浏览器把行末作为语句的结尾,通过使用分号,可以在一行中写多条语句。

  6。

  //JavaScript 变量名称的规则:

  变量对大小写敏感(y 和 Y 是两个不同的变量)

  变量必须以字母或下划线开始

  7。

  //变量的声明

  如果您所赋值的变量还未进行过声明,该变量会自动声明。

  例:

  x=5; carname="Volvo";

  与后面的这些语句的效果相同:var x=5; var carname="Volvo";

  8。

  //比较运算符

  运算符      描述    例子

  === 全等(值和类型)  x===5 为 true; x==="5" 为 false

  9。

  //条件运算符(三目运算符)

  JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符。

  name=("liuhuan"=="LH")?"刘欢":"歌星";

  10。

  //获得当前系统时间(小时数)

  var d = new Date()

  var time = d.getHours()

  11。

  //随机数

  var num=Math.random();

  产生的伪随机数介于 0 和 1 之间(含 0,不含 1),也就是,返回值可能为0,但总是小于1。在第一次加载 JScript 时随机数发

  生器自动产生 。

  12。

  //获取今天的星期数(星期日为0,星期1-6为1-6)

  var d = new Date()

  theDay=d.getDay()

  13。

  //按钮的触发事件

  <input type="button" onclick="disp_alert()" value="显示警告框" />

  14。

  //弹出框内容换行

  alert("再次向您问好!在这里,我们向您演示" + '\n' + "如何向警告框添加折行。")

  15.

  //确认框(删除方法)

  //confirm("文本")

  <script type="text/javascript">

  function show_confirm()

  {

  var r=confirm("确认删除?");

  if (r==true) {

  alert("删除成功!");

  }

  else{

  alert("删除失败!");

  }

  }

  </script>

  16.

  //于用户交互的弹出框(可输入文字的提示框)

  //prompt("文本","默认值")

  <script type="text/javascript">

  function disp_prompt()

  {

  var name=prompt("请输入您的名字","Bill Gates")

  if (name!=null && name!=""){

  document.write("你好!" + name + " 今天过得怎么样?")

  }

  }

  </script>

  17。

  //带有参数并返回值的函数

  <head>

  <script type="text/javascript">

  function product(a,b)

  {

  return a*b;

  }

  </script>

  </head>

  <body>

  <script type="text/javascript">

  document.write(product(6,5))

  </script>

  </body>

  18。

  //for循环 (本例中动态生成html中的h标签)

  <body>

  <script type="text/javascript">

  for (i = 1; i <= 6; i++){

  document.write("<h" + i + ">这是标题 " + i)

  document.write("</h" + i + ">")

  }

  </script>

  </body>

  19。

  //break跳出语句

  <script type="text/javascript">

  var i=0

  for (i=0;i<=10;i++){

  if (i==3){break}

  document.write("数字是 " + i)

  document.write("<br />")

  }

  </script>

  <p>解释:循环会在 i=3 时中断。</p>

  20。

  //continue跳出语句

  <script type="text/javascript">

  var i=0

  for (i=0;i<=10;i++){

  if (i==3){continue}

  document.write("数字是 " + i)

  document.write("<br />")

  }

  </script>

  <p>解释:当 i=3 时,会中断循环,并从下一个值开始继续循环。</p>

  值为:01245678910

  21。

  //for in循环(相当于.net中的foreach循环)

  <html>

  <body>

  <script type="text/javascript">

  var x

  var mycars = new Array()

  mycars[0] = "宝马"

  mycars[1] = "奔驰"

  mycars[2] = "宾利"

  for (x in mycars)

  {

  document.write("x的值为"+x+ "<br />");

  document.write(mycars[x] + "<br />")

  }

  </script>

  </body>

  </html>

  22。

  //javascript事件

  onload   某个页面或图像被完成加载 //页面加载

  onunload  用户退出页面

  onfocus  元素获得焦点

  onblur   元素失去焦点       //表单验证

  onchange  用户改变域的内容

  onreset  重置按钮被点击

  onsubmit  提交按钮被点击  //用于在提交表单之前验证所有的表单域。

  例如:

  (当用户单击表单中的确认按钮时,checkForm() 函数就会被调用。checkForm() 函数的返回值是 bool类型,如果返回值为true,则

  提交表单,反之取消提交。)

  <form method="post" action="xxx.htm" onsubmit="return checkForm()">

  onkeydown  某个键盘的键被按下

  onkeypress  某个键盘的键被按下或按住   //键盘操作

  onkeyup  某个键盘的键被松开

  onclick  鼠标点击某个对象

  ondblclick 鼠标双击某个对象

  onmousedown 某个鼠标按键被按下    //鼠标操作

  onmousemove 鼠标被移动

  onmouseout  鼠标从某元素移开

  onmouseover 鼠标被移到某元素之上

  onmouseup  某个鼠标按键被松开

  onabort    图像加载被中断

  onerror  当加载文档或图像时发生某个错误

  onresize  窗口或框架被调整尺寸

  onselect  文本被选定

  23。

  //js中的错误提示 err.description及其try...catch 语句

  例如:

  <script type="text/javascript">

  var txt=""

  function message(){

  try{

  adddlert("Welcome guest!")

  }

  catch(err){

  txt="本页中存在错误。\n\n"

  txt+="错误描述:" + err.description + "\n\n"

  txt+="点击“确定”继续。\n\n"

  alert(txt);

  }

  }

  </script>

  24。

  //带有确认框的 try...catch 语句

  <head>

  <script type="text/javascript">

  var txt=""

  function message(){

  try{

  adddlert("Welcome guest!")

  }

  catch(err){

  txt="本页中存在错误。\n\n"

  txt+="点击“确定”继续查看本页,\n"

  txt+="点击“取消”返回首页。\n\n"

  if(!confirm(txt))

  {

  document.location.href="../index.html"

  }

  }

  }

  </script>

  </head>

  <body>

  <input type="button" value="查看消息" onclick="message()" />

  </body>

  25。

  //创建 exception(异常或错误)。(配合try...catch语句使用)

  例如:

  <script type="text/javascript">

  var x=prompt("请输入 0 至 10 之间的数:","")

  try{

  if(x>10)

  throw "Err1"

  else if(x<0)

  throw "Err2"

  else if(isNaN(x))

  throw "Err3"

  }

  catch(er){

  if(er=="Err1")

  alert("错误!该值太大!")

  if(er == "Err2")

  alert("错误!该值太小!")

  if(er == "Err3")

  alert("错误!该值不是数字!")

  }

  </script>

  26。

  //return true和return true的用法

  (它可以返回一个bool型的参数,继续用于判断)

  function jiance(msg,url,l){

  alert("你确定吗?")

  return true

  }

  function jieguo(){

  if(jiance()){

  alert("是");

  }

  else{

  alert("否");

  }

  }

  27.

  //onerror 事件

  <html><head>

  <script type="text/javascript">

  //当出现错误时触发onerror事件

  onerror=handleErr;

  var txt=""

  function handleErr(msg,url,l){

  txt="本页中存在错误。\n\n"

  txt+="错误:" + msg + "\n"

  txt+="URL: " + url + "\n"

  txt+="行:" + l + "\n\n"

  txt+="点击“确定”继续。\n\n"

  alert(txt)

  return true

  }

  function message(){

  adddlert("确定吗?")

  }

  </script>

  </head><body>

  <input type="button" value="查看消息" onclick="message()" />

  </body></html>

  28。

  //JavaScript 中使用反斜杠来向文本字符串添加特殊字符。

  例如:

  var txt="We are the so-called \"Vikings\" from the north."

  document.write(txt)

  29。

  //javascript注意事项

  1。JavaScript 对大小写敏感

  2。JavaScript 会忽略多余的空格

  3。在编写代码时可以使用反斜杠进行换行

  例:

  document.write("Hello \

  World!");