<script type="text/javascript">function choice(obj){var checkbox = document.getElementsByName('music');for(var i=0;i<checkbox.length;i++){if(obj=='全选'){checkbox[i].checked=true;}if(obj=='全不选'){checkbox[i].checked=false;}if(obj=='反选'){checkbox[i].checked=!checkbox[i].checked;}}}</script></head><body><h1>添加音乐</h1><input type="checkbox" name="music" />哪里都是你<br/><input type="checkbox" name="music" />关于你<br/><input type="checkbox" name="music" />偏爱<br/><input type="checkbox" name="music" />Love Story(Taylor's Version)<br/><input type="checkbox" name="music" />晚风<br/><input type="checkbox" name="music" />蜜蜂<br/><input type="checkbox" name="music" />这首歌没唱直接听<br/><input type="button" value="全选" onclick="choice('全选')" /><input type="button" value="全不选" onclick="choice('全不选')" /><input type="button" value="反选" onclick="choice('反选')" /></body></html>
获取下拉框选中的值
<script type="text/javascript">function test(){var sel = document.getElementById('sel');//console.log(sel.value); // 获取到你选择的选择对应的value值var options = sel.options;for(var i=0;i<options.length;i++){// options[i] 可以获得到每个下拉选项,但是想过滤出被选中的那个if(options[i].selected == true){//过滤出被选中的那个alert(options[i].value+'----'+options[i].text);}}}</script></head><body><select id="sel" onchange="test()"><option value="0">青铜班</option><option value="1">白银班</option><option value="2">黄金班</option><option value="3">铂金班</option><option value="4">钻石班</option></select></body></html>
页面加载获得焦点
<body onload="document.getElementById('username').focus();"> <!--onload页面加载 focus获得焦点-->用户名:<input type="text" id="username"/>密码:<input type="password"/></body>
实现点赞动画
<script type="text/javascript">function addGreat(){// 创建一个动图:var imgNode = document.createElement('img');imgNode.src="./emoji.gif";//获取divvar mydiv = document.getElementById('mydiv');// 将动图放入div中:mydiv.appendChild(imgNode);// 调整动图大小imgNode.style.width="85px";// 给动图设置一定绝对定位imgNode.style.position="absolute";imgNode.style.top="200px";imgNode.style.left="200px"// 让emoji往上走,边走边消失// 设置图片的饱和度:imgNode.style.opacity= 1 ;var id =setInterval(function(){// 饱和度一直在减少:imgNode.style.opacity-=0.01;// 距离上边距的高度也应该逐渐减少:imgNode.style.top=(imgNode.offsetTop-2)+"px";console.log('aaa');if(imgNode.style.opacity <=0){clearInterval(id);}},15);}</script></head><body><input type="button" value="点赞" onclick="addGreat()" /><div id="mydiv"></div></body></html>
