1.什么是JavaScript?
- JavaScript被设计用来向HTML页面添加交互行为
- JavaScript是一种脚本语言(脚本语言是一种轻量级的编程语言)
- JavaScript由数行可执行计算机代码组成
- JavaScript通常被直接嵌入HTML页面
- JavaScript是一种解释性语言(就是说，代码执行不进行预编译)
- 所有的人无需购买许可证均可使用JavaScript
JavaScript与java没有关系(雷锋塔和雷锋)，他不是编程语言(脚本语言)
2.JavaScript的作用
- HTML：它是整个网站的骨架。
- CSS：它是对整个网站骨架的内容进行美化(修饰)
- Javascript：它能够让整个页面具有动态效果。
3.JavaScript的组成部分
- ECMAScript:它是javascript的核心(语法、变量、数据类型、语句、函数……)
- DOM:document object model 整个文档对象
- BOM:浏览器对象
4.JavaScript的语法
区分大小写
变量是弱类型的(String str="aaa" ,var str="123";)
每行结尾的分号可有可无(建议大家写上)
注释与java、php等语言相同。
5.JavaScript的变量
变量可以不用声明，变量是弱类型。统一使用var来定义！定义变量的时候不要使用关键字和保留字。
6.JavaScript的数据类型
Javascript数据类型分为原始数据类型和引用数据类型
原始数据类型：
- string
- number
- boolean
- null
- undefined
引用数据类型：
- Array
- Boolean
- Date
- Math
- Number
- String
- ReqExp
7.JavaScript的运算符
其它运算符与java大体一致，需要注意其等性运算符。
== ：它在做比较的时候会进行自动转换。
=== ：它在做比较的时候不会进行自动转换。
8.JavaScript的语句
所有语句与java大体一致。
9.获取元素内容
获取元素
document.getElementById(“id名称”);
获取元素里面的值
document.getElementById(“id名称”).value;
10.JavaScript的事件
- onfocus/onblur:聚焦离焦事件，用于表单校验的时候比较合适。
- onclick/ondblclick:鼠标单击和双击事件
- onkeydown/onkeypress：搜索引擎使用较多
- onload：页面加载事件，所有的其它操作(匿名方式)都可以放到这个绑定的函数里面去。如果是有名称，那么在html页面中只能写一个。
- onmouseover/onmouseout/onmousemove：购物网站商品详情页。
- onsubmit：表单提交事件 ，有返回值，控制表单是否提交。
- onchange:当用户改变内容的时候使用这个事件(二级联动)
11.JavaScript的输出
警告框：alert();
向页面指定位置写入内容：innerHTML(属性)
向页面写入内容：document.write("");
12.JavaScript的引入方式
内部引入方式
直接将javascript代码写到<script type=”text/javascript”></script>
外部引入方式
需要创建一个.js文件，在里面书写javascript代码，然后在html文件中通过script标签的src属性引入该外部的js文件
12.JavaScript的对象
1.BOM对象
BOM对象：浏览器对象模型(操作与浏览器相关的内容)
Window对象
Window 对象表示浏览器中打开的窗口。
setInterval():它有一个返回值，主要是提供给clearInterval使用。
setTimeout():它有一个返回值，主要是提供给clearTimeout使用。
clearInterval():该方法只能清除由setInterval设置的定时操作
clearTimeout():该方法只能清除由setTimeout设置的定时操作
弹出框的几个方法：
<script>
//警告框
//alert("aaa");
//确认按钮
//confirm("您确认删除吗？");
//提示输入框
prompt("请输入价格：");
</script>
Location对象
Location 对象包含有关当前 URL 的信息。
href:该属性可以完成通过JS代码控制页面的跳转。
<html>
<head>
<meta charset="UTF-8">
<title>location对象</title>
<script>
function tiao(){
window.location.href="http://www.itcast.cn";
}
</script>
</head>
<body>
<a href="#" onclick="tiao()">跳转到传智播客首页</a>
</body>
</html>
History对象
History 对象包含用户（在浏览器窗口中）访问过的 URL。
历史页面：使用location页面(把href属性值改为当前的history)
History页面代码：
<input type="button" value="返回上一个页面" onclick="javascript:history.back()"/>
go(参数)
参数：-1 返回上一个历史记录页面；-2返回上上一个历史记录页面，1进入下一个历史记录页面。
让按钮点击失效
onclick=”javascript:volid(0)”
Navigator对象
Navigator 对象包含有关浏览器的信息。(该对象开发中不怎么常用)
Screen对象
Screen 对象包含有关客户端显示屏幕的信息。(该对象开发中不怎么常用)
2.DOM对象
javascript的DOM操作
Document:整个html文件都成为一个document文档
Element:所有的标签都是Element元素
Attribute：标签里面的属性
Text：标签中间夹着的内容为text文本
Node:document、element、attribute、text统称为节点node.
Document对象
每个载入浏览器的 HTML 文档都会成为 Document 对象。
后面两个方法获取之后需要遍历！
以下两个方法很重要，但是在手册中查不到！
创建文本节点：document.createTextNode()
创建元素节点：document.createElement()
Element对象
我们所认知的html页面中所有的标签都是element元素
- element.appendChild()向元素添加新的子节点，作为最后一个子节点。
- element.firstChild返回元素的首个子节点。
- element.getAttribute()返回元素节点的指定属性值。
- element.innerHTML设置或返回元素的内容。
- element.insertBefore()在指定的已有的子节点之前插入新节点。
- element.lastChild返回元素的最后一个子元素。
- element.setAttribute()把指定属性设置或更改为指定值。
- element.removeChild()从元素中移除子节点。
- element.replaceChild()替换元素中的子节点。
Attribute对象
我们所认知的html页面中所有标签里面的属性都是attribute
3.javascript内置对象
Array对象
数组的创建：
数组的特点：
长度可变！数组的长度=最大角标+1
Boolean对象
对象创建：
如果value 不写，那么默认创建的结果为false
Date对象
getTime()
返回 1970 年 1 月 1 日至今的毫秒数。
解决浏览器缓存问题
Math和number对象
与java里面的基本一致。
String对象
match()找到一个或多个正则表达式的匹配。
substr()从起始索引号提取字符串中指定数目的字符。
substring()提取字符串中两个指定的索引号之间的字符。
例子：
<script>
var str = "-a-b-c-d-e-f-";
var str1 = str.substr(2,4);//-b-c
//alert(str1);
var str2 = str.substring(2,4);//-b
alert(str2);
</script>
RegExp对象
正则表达式对象
test
检索字符串中指定的值。返回 true 或 false
全局函数
全局属性和函数可用于所有内建的 JavaScript 对象
关于编码和解码的一组方法：
<script>
var str = "张三";
//alert(encodeURI(str));//%E5%BC%A0%E4%B8%89
//alert(encodeURIComponent(str));//%E5%BC%A0%E4%B8%89
//alert(decodeURI(encodeURI(str)));//张三
//alert(decodeURIComponent(encodeURIComponent(str)));//张三
var str1 = "http://www.itheima.cn";
//alert(encodeURI(str1));//http://www.itheima.cn
//alert(encodeURIComponent(str1));//http%3A%2F%2Fwww.itheima.cn
//alert(decodeURI(encodeURI(str1)));//http://www.itheima.cn
//alert(decodeURIComponent(encodeURIComponent(str1)));//http://www.itheima.cn
var str2 = "alert('abc')";
//alert(str2);
eval(str2);
</script>
));//http%3A%2F%2Fwww.itheima.cn
//alert(decodeURI(encodeURI(str1)));//http://www.itheima.cn
//alert(decodeURIComponent(encodeURIComponent(str1)));//http://www.itheima.cn
var str2 = "alert('abc')";
//alert(str2);
eval(str2);
</script>
1471
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
