温故而知新----javascript

原创 2016年10月08日 17:30:09

一、javascript 实例

1、用javascript 输出文本

document.write(Date());

2、用javascript改变html元素

document.getElementById("demo").innerHTML = "";

3、换行警告框

alert("Hello\nHow are you?");

4、确认框

var r = confirm("按下按钮");

r = true : 按下了 “确定” 按钮

r = false : 按下了 “取消” 按钮

5、try catch

try {


}catch(err){

     alert( "错误描述:"+err.message);

}


2)onerror = handler(msg,url,l)

   ....

    txt+="错误: " + msg + "\n";
    txt+="URL: " + url + "\n";
    txt+="行: " + l + "\n\n";

  ....

6、字符串对象

(1)字符串长度,txt.length

(2)给字符串添加样式

var txt = "Hello World!";
document.write("<p>字体变大: " + txt.big() + "</p>");
document.write("<p>字体缩小: " + txt.small() + "</p>");
document.write("<p>字体加粗: " + txt.bold() + "</p>");
document.write("<p>斜体: " + txt.italics() + "</p>");
document.write("<p>固定定位: " + txt.fixed() + "</p>");
document.write("<p>加删除线: " + txt.strike() + "</p>");
document.write("<p>字体颜色: " + txt.fontcolor("green") + "</p>");
document.write("<p>字体大小: " + txt.fontsize(6) + "</p>");
document.write("<p>下标: " + txt.sub() + "</p>");
document.write("<p>上标: " + txt.sup() + "</p>");
document.write("<p>链接: " + txt.link("http://www.w3cschool.cc") + "</p>");
document.write("<p>闪动文本: " + txt.blink() + " (不能用于IE,Chrome,或者Safari)</p>");

(3)indexOf() : 返回字符串中指定文本首次出现的位置

    var str="Hello world, welcome to the universe.";
    var n=str.indexOf("ello"); //1

    var n=str.indexOf("zhasoahn"); //-1

(4)replace

   var str=document.getElementById("demo").innerHTML;
    var n=str.replace("Microsoft","W3CSchool");

 


7、Date(日期)对象

var d=new Date();

(1)显示今天的日期时间
document.write(d);

(2)1970年1月1号至今的毫秒数

d.getTime();

(3)使用 setFullYear() 设置具体的日期

注:JavaScript月数是从0至11。10是11月
     d.setFullYear(2016,7,29);

(4)

var weekday=new Array(7);
    weekday[0]="周日";
    weekday[1]="周一";
    weekday[2]="周二";
    weekday[3]="周三";
    weekday[4]="周四";
    weekday[5]="周五";
    weekday[6]="周六";
    var x = document.getElementById("demo");
    x.innerHTML=weekday[d.getDay()];


8、Array(数组)对象

var fruits = ["Banana", "Orange", "Apple", "Mango"];

1)var family = parents.concat(brothers, children);

2)join:用数组元素组成字符串

     fruits.join();

3)pop():删除数组最后一个元素

      fruits.pop();

4)push :数组末尾添加新的元素

     fruits.push("Kiwi");

5)shift:删除数组的第一个元素

     fruits.shift();

6)reverse:反转一个数组中的元素的顺序

    fruits.reverse();  

7)slice:从一个数组中选择元素

    fruits.slice(1,3);//Orange,Lemon

7)sort: 数组排序(按字母顺序升序)- sort()

             数字排序(按数字顺序升序)- sort()  

8)splice:在数组的第2位置添加一个元素 - splice()

      fruits.splice(2,0,"Lemon","Kiwi"); //Banana,Orange,Lemon,Kiwi,Apple,Mango

9)转换数组到字符串 -toString()

      fruits.toString();

10)在数组的开头添加新元素 - unshift()

      fruits.unshift("Lemon","Pineapple");

注意: unshift()方法不能用于 Internet Explorer 8 之前的版本,插入的值将被返回成undefined

9、History对象

返回一个url的历史清单

window.history.length

window.history.back()

window.history.forword()

window.history.go(-2)

10、Document 对象

(1)锚

文档中锚的数量:document.anchors.length

文档中锚第一个锚的内容:document.anchors[0].innerHTML

(2) 表单

document.forms.length

document.forms[0].name

(3)图像

document.images.length

document.images[0].id

(4)链接

document.links.length

(5)文档中所有cookies的名称/值对

document.cookie

(6)域名

document.domain

(7)文档最后一次修改时间

document.lastModified

11、Event对象

键盘键的keycode

(1)

function whichButton(event){
    alert(event.keyCode);
}

(2)鼠标指针的 x 和 y 坐标

function show_coords(event){
    var x=event.clientX;
    var y=event.clientY;
    alert("X coords: " + x + ", Y coords: " + y);
}

(3)指针相对于屏幕的 x 和 y 坐标。

function coordinates(event){
    x=event.screenX
    y=event.screenY
    alert("X=" + x + " Y=" + y)
}

(4)是否按下 shift 键

function isKeyPressed(event){
    if (event.shiftKey==1){
        alert(" shift 键被按下!");
    }
    else{
        alert(" shift 键没被按下!");
    }
}

(5)event.type

//mousedown


12、Option and Select 对象

<select id="mySelect">
<option>苹果</option>
<option>梨子</option>
<option>香蕉</option>
<option>橙子</option>
</select>

(1)下拉列表数量

document.getElementById("mySelect").length

(2)修改为多行列表

function changeSize(){
    document.getElementById("mySelect").size=4;
}

(3)弹出选中项

function getIndex(){
    var x=document.getElementById("mySelect");
    alert(x.selectedIndex);
}

(4)弹出选中项文本

x.options[x.selectedIndex].text

(5)移除你的选项

x.remove(x.selectedIndex);

13、Table, TableHeader, TableRow, TableData 对象

<table id="myTable" border="1">
<tr>
  <td>行 1</td>
  <td><input type="button" value="删除" onclick="deleteRow(this)"></td>
</tr>

<tr id="tr1">
    <td>Peter</td>
    <td>Griffin</td>
</tr>

</table>

(1)创建标题

function createCaption(){
    var x=document.getElementById('myTable').createCaption();
    x.innerHTML="表的标题";
}

(2)删除表格中的行

function deleteRow(r){
    var i=r.parentNode.parentNode.rowIndex;
    document.getElementById('myTable').deleteRow(i);
}

(3)添加表格中的行

function insRow(){
    var x=document.getElementById('myTable').insertRow(0);
    var y=x.insertCell(0);
    var z=x.insertCell(1);
    y.innerHTML="新单元格1";
    z.innerHTML="新单元格2";
}

(4)添加单元格

function insCell(){
    var x=document.getElementById('tr1').insertCell(0);
    x.innerHTML="The famous";
}

(5)

document.getElementById('header').align="left";

document.getElementById('tr2').vAlign="top";

(6)

function setColSpan(){
    var x=document.getElementById('myTable').rows[0].cells;
    x[0].colSpan="2";
    x[1].colSpan="6";
}


14、JavaScript 数据类型

String

Number

Boolean

Object

Array

Null

undefined

Javascript高级程序设计温故而知新

Array类的length是可读可写的量。通过length可以裁剪数组 Array.prototype.push将会返回Push之后的长度 Array.prototype.concat()可以接收...
  • u013096194
  • u013096194
  • 2016年11月01日 23:11
  • 139

温故而知新: JavaScript arguments 对象详解

温故而知新: JavaScript arguments 对象详解
  • cc18868876837
  • cc18868876837
  • 2016年11月29日 14:51
  • 1678

Servlet 温故而知新

原文地址:http://www.importnew.com/14621.html            Servlet 是一些遵从Java Servlet API的Java类,这些Java类可以响应...
  • boonya
  • boonya
  • 2015年01月28日 10:50
  • 672

NW温故而知新

去年基于NW.js 0.12.3做过一个项目,当时对于NW中的contexts的理解比较模糊。今天在twiiter上看到发布新的版本,重新又打开了nwjs.io网站的文档部分,落地页面是NW中的con...
  • Practicer2015
  • Practicer2015
  • 2017年11月11日 11:13
  • 112

温故而知新之异常处理

本文从Java异常基本的概念、语法开始讲述Java异常处理的基本知识,分析Java的异常体系结构,对比Spring的异常处理框架,阐述了异常的处理原则。 第一:异常的概念和Java异常体系结构 ...
  • qiulongtianshi
  • qiulongtianshi
  • 2013年09月24日 17:12
  • 3157

SQL温故而知新-基础篇

SQL温故而知新-基础篇 what is sql? SQL 指结构化查询语言 SQL 使我们有能力访问数据库 SQL 是一种 ANSI 的标准计算机语 知识点: RDBMS 指的是关系型数...
  • wozyb1995
  • wozyb1995
  • 2017年04月27日 11:48
  • 95

Linux 温故而知新1

一、进程 僵尸进程: 一个进程使用fork创建子进程,如果子进程退出,而父进程并没有调用wait或waitpid获取子进程的状态信息,那么子进程的进程描述符仍然保存在系统中,这种进程称之为僵尸进程;...
  • qq_18854309
  • qq_18854309
  • 2018年01月14日 19:18
  • 2

温故而知新之素数

明明是小学生的知识点,可是现在看来却把我完全整懵了。。o(︶︿︶)o 纠结了几天,正好碰到老师讲类似的例题。 如何判断数m为素数,素数也是质数,只能被1和m整除。即不存在m>i,t>1,使得m=i*t...
  • Sharon365
  • Sharon365
  • 2015年02月01日 10:23
  • 239

温故而知新(一)TreeMap

TreeMap一种”有序”的Mapimport java.util.Map; import java.util.TreeMap; import java.util.Iterator; import j...
  • cjh_android
  • cjh_android
  • 2016年07月31日 13:16
  • 247

第一章:温故而知新

1.程序的虚拟地址和物理地址存在一种映射关系,这种映射说由MMU(Memory Manager Unit)完成的。 2.分页说把地址空间人为的分成固定大小的页,每一页的大小由硬件决定。目前几乎所有的...
  • hai200501019
  • hai200501019
  • 2017年03月02日 09:33
  • 135
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:温故而知新----javascript
举报原因:
原因补充:

(最多只允许输入30个字)