JavaScript导入
- 将JavaScript代码放到
<header>
标签中的<script>
中 - 将JavaScript代码存进.js文件中,使用
<script src="">
导入。最好的方法是放到</body>
之前
javascript 语法
语句
- 多条语句放在不同得行上就可以分隔它们
- 多条语句放在同一行上:用分号分隔
- 建议在每条语句后都加入分号
注释
- 用
//
注释单行,/**/
注释多行
- 用
声明和赋值
var a="happy",x = 33
转义
- 使用反斜线
\
进行转义
- 使用反斜线
关联数组(不推荐使用)
var lemon = Array();lemon["name"] = "John"
拼接
- 字符串+数值 返回字符串;
alert("10"+20) //返回“1020”
- 数值+字符串 返回数值的算术和
alert(10+“20”) //返回30
- 字符串+数值 返回字符串;
对象
有属性和方法
继承
实例
点击链接切换图片
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<ul>
<li>
<a href="1.jpg" title="罗云熙" onclick="showpic(this);return false;">罗云熙</a>
</li>
<li>
<a href="2.jpg" title="王一博"onclick="showpic(this);return false;">王一博</a>
</li>
<li>
<a href="3.jpg" title="赵丽颖"onclick="showpic(this);return false;">赵丽颖</a>
</li>
</ul>
<img src="1.jpg" id="placeholder" alt="image">
<script>
function showpic(whichpic){
var source = whichpic.getAttribute("href");
var placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src",source);
}
</script>
</body>
</html>window.open(url,name,features)
创建新的浏览器窗口- features : 新窗口的属性,如尺寸、启动和禁用的功能等
DOM Core
- getElementById
- getElementByTagName
- getElementByClassName
- getAttribute
- setAttribute
动态创建标记
- document.write
- createElement
- appendChild
- createTextNode
- nextSibling 查找下一个节点
- setTimeout 让某个函数在经过一段时间后才开始执行
- CSS中的overflow属性用来处理一个元素的尺寸超出其容器的情况。可取值如下:
- visible:不裁剪溢出的内容。浏览器吧溢出的内容呈现在其元素的显示区域以外,全部内容都可见。
- hidden:隐藏溢出的内容。内容只显示在容器的显示区域里,只有以部分内容可见。
- scroll:对溢出的内容进行隐藏,但显示一个滚动条以便让用户看到内容的其他部分。
- auto:只有发生溢出时才显示滚动条。