本片博文是JavaScript的基础总结,所有知识点均来自W3C,你也可以直接登陆W3C学习,但是如果为了快速掌握基础的知识,阅读本文将是不错的选择。
1.简介 JavaScript能作什么呢以及它的简单使用
相关的语句(下面的句子将在后续详细介绍,这些句子相信你或多或少都接触过):
document.write("<h1>你好,穆先生<h1>"); 文档输出
innerHTML="世界真美好"; 给某些元素内部赋值
element.src="/.."; 更改元素的属性 element.style.color="#ff0000";
输入验证 is isNaN(x){ alert("不是个数")}
外部js <script src="myScript.js"></script> 外部的js脚本不能包含script标签
2.输出
document.getElementById("id")
document.write("123"); 加载后执行会覆盖整个html文档
3.语句
document.getElementById("id").innerHTML="我的世界"; 大小写敏感,忽略空格,反斜线折行
4.注释
// /* */
5.变量
$ _ 字母 大小写敏感 申明多个变量时可以用逗号隔开
6.数据类型
动态数据类型:数字,字符串,数组,布尔,对象,Null,undefined (不含值)
var num=new Number();
7.函数
多个参数用逗号隔开
8.JS运算符
= + * / % - ++ == === < > != >= <= && || ! a=(b)?c:d
9.条件判断
switch(n)
{
case 1:
执行代码;
break;
default:
}
10.for/in循环
for(x in person){
text=text+person[x];
}
x为person的每个属性
var person={name:"John",age:"25"}
11.while do/while循环
12.break continue
13.try catch throw 异常可以使字符串,数字,逻辑值,对象
14.js对于咱们后台程序员来说主要是用来验证前台的输入的
15.document.write(Date());不要在页面加载之后使用这个方法,会覆盖整个文档
innerHTML 改变DOM元素内容:
document.getElementById("p1").innerHTML="New text!";
attribute 改变DOM元素属性:
document.getElementById("image").src="landscape.jpg";
style.property 改变DOM元素的样式:
document.getElementById("p2").style.color="blue";
若想了解更多的DOM对象知识,可以去W3C官网下载HTML DOM style对象参考手册和HTML DOM event对象参考手册
16.节点:
appendChild removeChild parentNode
添加:
var para=document.createElement("p");
var node=document.createTextNode("这是新段落。");
para.appendChild(node);
var element=document.getElementById("div1");
element.appendChild(para);
删除:
var child=document.getElementById("p1");
child.parentNode.removeChild(child);
了解更多可以参W3C的HTML DOM教程
17.JS中的对象 Number对象参考手册,String对象参考手册,JavaScript Date 对象参考手册
18. var myBoolean=new Boolean() JavaScript Boolean 对象参考手册
如果逻辑对象无初始值或者其值为 0、-0、null、""、false、undefined 或者 NaN,那么对象的值为 false。否则,其值为 true(即使当自变量为字符串 "false" 时)!
20.RegExp 对象有 3 个方法:test()、exec() 以及 compile() RegExp 对象参考手册
21.浏览器对象模型(Browser Object Model)
- window.innerHeight - 浏览器窗口的内部高度
- window.innerWidth - 浏览器窗口的内部宽度
- window.open() - 打开新窗口
- window.close() - 关闭当前窗口
- window.moveTo() - 移动当前窗口
- window.resizeTo() - 调整当前窗口的尺
22.Window Screen
- screen.availWidth - 可用的屏幕宽度
- screen.availHeight - 可用的屏幕高度
23.Window Location
- location.hostname 返回 web 主机的域名
- location.pathname 返回当前页面的路径和文件名
- location.port 返回 web 主机的端口 (80 或 443)
- location.protocol 返回所使用的 web 协议(http:// 或 https://)
- location.href 属性返回当前页面的 URL
24.Window History
- history.back() - 与在浏览器点击后退按钮相同
- history.forward() - 与在浏览器中点击按钮向前相同
25.Window Navigator 对象包含有关访问者浏览器的信息
来自 navigator 对象的信息具有误导性,不应该被用于检测浏览器版本
- navigator 数据可被浏览器使用者更改
- 浏览器无法报告晚于浏览器发布的新操作系统
26.JavaScript 消息框
alert("文本")
confirm("文本")
prompt("文本","默认值")
27.JavaScript 计时事件
setTimeout()
未来的某时执行代码
clearTimeout()
取消setTimeout()
var t=setTimeout("javascript语句",毫秒)
28.Cookie获取和存储