S13.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
/*css代码*/
</style>
<script>
// javascript代码
alert(123);
</script>
</head>
<body>
</body>
</html>
<!--alert(123); 出弹窗-->
Commons.js
/**
* Created by Administrator on 2019/4/10/010.
*/
alert(123);
S14.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="commons.js"></script>
</head>
<body>
</body>
</html>
<!--script src="commons.js" 引入javascript文件-->
<!--<script type="text/javascript"></script> 与 <script></script> 效果一样-->
S15.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>asdsa</h1>
<script src="https://www.gstatic.com/og/_/js/k=og.og2.en_US.iF4jnkQuaf0.O/rt=j/t=zcms/m=def/exm=in,fot/d=1/ed=1/rs=AA2YrTv5-POC4Ks9GtGRdY2ywUWisqz7-Q"></script>
</body>
</html>
<!--也可以引入远程的js文件-->
<!--script放到body标签最后解释执行，以利于先加载网页内容-->
S16.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>assasdf</h1>
<script>
//alert(123456);
/* alert(123456)
alert(123456)
alert(123456) */
</script>
</body>
</html>
<!--javascript注释用 // -->
<!--/* alert(123456)-->
<!--alert(123456)-->
<!--alert(123456) */ 多行注释同style-->
S16-1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>asdsd</h1>
<script>
name='alex';
function func() {
var name='eric'
}
age = "18";
i=parseInt(age);
</script>
</body>
</html>
<!--name='alex'; 全局变量(默认)-->
<!--var name='eric' 局部变量 用在函数里-->
<!--i=parseInt(age); 把age的值 字符串转换成数字类型-->
<!--parseFloat 转换成浮点数(小数点)-->
S16-2,html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
以下在console里操作:
a='alex'
a.charAt(2) 通过字符串的下标来获取对应的字符 或取第2个字符
a.substring(1,3) 取大于等于1 小于3的下标字符 子序列
a.length a变量值的长度 即字符串长度
a.concat(' li') 字符串拼接
a.indexOf('e') 找出e 的下标
a.split('l') 以'l'为记号分割字符串成列表
a.split('l',2) 分割并取前两个
布尔类型: ture false
a=[11,22,33] 数组(列表)
a.length 数组长度(有几个元素)
a.push('66') 尾部追加'66'
a.pop() 删除尾部成员
a.unshift('00') 开头添加成员
a.shift() 删除开头成员
a.splice(在哪个下标位置开始，删除几个，插入的数据)
a.splice(第几个位置开始，删除几个)
a.slice(1,3) 切片获取列表 下标大于等于1 小于3
a.reverse(); 反转 后面的到前面
a.join("-") 列表加上分隔符显示
a.concat('66') 数组拼接
a.sort() 排序 从小到大
a={'k1':'v1','k2':'v2'} 字典
a['k2'] 获取字典的value
S17.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function f1() {
console.log(1);
}
//setInterval("alert(123)",5000)
setInterval("f1();",5000)
</script>
</body>
</html>
setInterval 创建一个定时器
setInterval("执行的东西",时间毫秒)
function f1() {
}定义函数
setInterval("f1()",5000) 执行函数f1()
console.log(1); 在console里打印一次"1"
a=[11,22,33,44,55] 列表
for(var item in a){console.log(item)} 循环索引
for(var item in a){console.log(a[item]);} 循环索引 并取值
for(var i=0;i<a.length;i++){console.log(a[i])} 循环索引 并取值
a={'k1':'v1','k2':'v2','k3':'v3'} 字典
for (var item in a ){console.log(item)} 循环key
for (var item in a ){console.log(a[item])} 循环key 并取value
if(条件){}
else if(条件){}
else{}
if(1=="1"){} 值一样 类型可以不一样
if(1!=1){}
if(1===1){} 值 类型都一样
if(1!==1){}
if(1==1 && 2 ==2){} && and的意思
if(1==1 || 2 ==2 ) || or的意思
函数:
function 函数名(形参){}
S18.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="i1">欢迎你下次光临</div>
<script>
function func() {
//通过标签id来获取标签
var tag=document.getElementById('i1')
//获取标签的文本内容
var content=tag.innerText;
//获取内容字符串的第一个字符
var f=content.charAt(0);
//获取第二个到最后的那个字符
var l=content.substring(1,content.length)
// 重新组合字符
var new_content=l+f;
//给标签的内容重新赋值
tag.innerText=new_content;
}
//设置定时器 执行func函数 1000毫秒执行一次
setInterval('func();',500);
</script>
</body>
</html>
tag=document.getElementById('i1'); 通过标签id 来获取标签
tag.innerText 获取标签的文本内容
case语句
<script>
name='5';
switch (name){
case '1':
console.log('111');
break;
case '2':
console.log('222')
break;
default :
console.log('other')
}
</script>