abstract:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>我的第一个动效</title><style>.fu{display:block;margin-top: 20px;}button{width:80px;height:40px;bord
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的第一个动效</title>
<style>
.fu{display:block;margin-top: 20px;}
button{width:80px;height:40px;border:none;background-color:#cde9ff;color:#3d5ac0;border-radius:20px;}
button:hover{background-color:#3d5ac0;color:#fff;}
.clear{clear:both;}
p{text-indent:2em;}
</style>
<script type="text/javascript">
function myradius(){
document.getElementById("myimg").style.borderRadius="20px";
}
function myzhong(){
document.getElementById("myimg").style.width="800px";
document.getElementById("myimg").style.height="auto";
}
function myxiao(){
document.getElementById("myimg").style.width="600px";
document.getElementById("myimg").style.height="auto";
}
function mymoren(){
document.getElementById("myimg").style.width="1000px";
document.getElementById("myimg").style.height="auto";
document.getElementById("myimg").style.borderRadius="0";
document.getElementById("myimg").src="http://www.php.cn/static/images/index_banner2.jpg";
}
function myshang(){
document.getElementById("myimg").src="http://www.php.cn/static/images/index_banner3.gif";
}
function myxia(){
document.getElementById("myimg").src="http://img.php.cn/upload/article/000/000/003/5b49b0e610f26951.jpg";
}
</script>
</head>
<body>
<div style="text-align: center;">
<div>
<button onclick="myradius()">圆角</button>
<button onclick="myzhong()">中</button>
<button onclick="myxiao()">小</button>
<button onclick="mymoren()">默认</button>
</div>
<div>
<img src="http://www.php.cn/static/images/index_banner2.jpg" alt="" id="myimg">
</div>
<div>
<button onclick="myshang()">上一张</button>
<button onclick="myxia()">下一张</button>
</div>
</div>
<div></div>
<div style="width:800px;background-color:#3d5ac0;margin:50px auto;color:#fff;padding:20px;">
<h2 style="text-align:center;">总结</h2>
<hr>
<p>1.if...else条件语句,只有if是可以不加花括号</p>
<p>2.for循环语句,初始化默认值、循环条件和步长三部分缺一不可</p>
<p>3.while循环与do while循环,不知道循环次数的情况下使用,二者区别是while先看条件再执行,do while反之且无论条件是否满足必然执行一次</p>
<p>4.switch...case语句是多重条件判断语句,用于多个值相等的比较,break跳出循环,default都不匹配执行</p>
<p>5.字符串相关函数: <br>
[1]lenght属性可以返回字符长度
[2]charAt返回一个字符值,是指定索引位置的值
[3]indexOf指出子字符串的开始位置
[4]lastIndexOf指出最后一个子字符串的开始位置
[5]substring(开始下标,结束)返回一个子字符串
[6]replace(要被替换的字符串,需要被替换成字符串):字符串替换函数
[7]concat可以连接俩两个或者多个字符串;
[8]substr(起始位置,长度)返回一个子字符串</p>
<p>类型转换函数
[1]string-0,字符串
[2]number.toString()
[3]parseInt(string)忽略非数字部分,从第一个字符开始找,找到非数字截止,只取整数部分,忽略小数
[4]parseFloat(string)把小数部分也取到
[5]number+""添加空字符串方法
</p>
<p>6.创建数组:var a=new Array(),var a=['php','html','web'],var a=Array(1,2,3,4……n);</p>
<p>7.concat()数组合并函数,join()将数组元素变成字符串,并且以指定分割符号分割,reverse()数组元素逆向排序,sort()数组元素按照一定规则排序(ASCLL字符顺序),splice()删除元素并向数组添加新元素,slice(起始位置,end)从数组中返回选定的元素,push()向数组末尾添加一个或者多个元素,并返回一个新数组的长度,pop() 删除并且返回数组的最后一个元素</p>
<p>8.系统函数(js的内置函数,可以直接拿过来使用的,自定义函数:自己创建的有特定功能的函数,function 函数名(参数1,参数2,……){函数体}</p>
<p>9.局部变量:在JavaScript函数内部声明,只能在函数体内部访问它;全局变量:在函数外声明的变量是全局变量(网页上所有的函数和脚本都可以使用)函数体外部的变量在函数外部使用</p>
<p>10.onfocus元素获得焦点,onblur元素失去焦点,onchange域的内容被改变,onclick当用户点击某个对象时调用的事件句柄,ondblclick当用户双击某个对象时调用的事件句柄,onkeydown某个键盘按键被按下,onkeyup某个键盘按键被松开,onkeypress某个键盘按键被按下并松开,onload一张页面或一幅图像完成加载,onmousedown鼠标按钮被按下,onmousemove鼠标被移动,onmouseout鼠标从某元素移开,onmouseover鼠标移到某元素之上,onmouseup鼠标按键被松开,onsubmit确认按钮被点击。</p>
</div>
</body>
</html>
Correcting teacher:天蓬老师Correction time:2019-07-01 17:38:46
Teacher's summary:总结写得不错, 就差一个实战了