1、js样式改变特效
<img src="/img/dog.png" id="dog">
</body>
<script>
dogobj=document.getElementById('dog');
dogobj.onmouseenter=function(){
this.style.background='#888';
this.style.borderRadius='128px';
}
</script>
2、js特效组成部分:
1)设置事件
2)事件触发
3)属性改变或样式改变
3、js标签放置位置:
js标签:
<script>
//js代码!
</script>
js标签放置位置
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 1)定义变量
// 2)定义函数
</script>
</head>
<body>
<!-- html实体标签 -->
</body>
<script>
//特效代码
</script>
</html>
4、js放置类型:
1)内联
2)内部
3)外部(推荐)
<script>
//js内部
dogobj=document.getElementById('dog');
dogobj.onmouseenter=function(){
this.style.background='#00f';
this.style.borderRadius='128px';
}
</script>
//js内联
<img src="/img/dog.png" id="dog" onclick='this.src="/img/sd.png"'>
//js外部
<script src='index.js'></script>