<style> *{ margin: 0;padding: 0; list-style: none; } body{ background: black; } .outer{ margin: 10px auto; border: 1px solid white; border-radius: 6px; background-color: white; width: 200px; padding: 8px 6px 6px 8px; } .outer>ul{ overflow: hidden…
思路: div的默认样式正常设置. 鼠标移入时,发生改变的样式有3个,即 边框颜色,div背景色,字体颜色. 把这三个css改变设置在一个类名下,再通过js给div动态 添加/去除这个类名,实现div样式改变. <style> body{color:#fff;font:12px/1.5 Tahoma;} #div1{ width:150px; height:150px; margin:0 auto; padding:10px; background:black; border:10px sol…
练习地址:http://www.fgm.cc/learn/lesson2/12.html 总结: 1.  && 运算符,从左向右依次执行,如果遇到 false,就不再继续执行后面的语句. 相当于if(oInput[i].checked) {n++;} oInput[i].checked && n++ 2. n == oInput.length - 1;   这句话先判断 n是不是等于oInput.length - 1  (即checkbox全都选中了)? 返回值 true/…
练习地址:http://www.fgm.cc/learn/lesson2/05.html <script> window.onload = function(){ var oDiv = document.getElementById('div1'); // var oInput1 = document.getElementsByTagName('input')[0].value; // var oInput2 = document.getElementsByTagName('input')[1…
<style> body{font-size: 12px;} .outer{ width: 500px; margin: 0 auto; } span{ color: #999; } input{ width: 220px; line-height: 20px; border: 1px solid #ccc; margin-bottom: 12px; } p{ font-size: 20px; color: red; font-weight: bold; } </style> &l…
<script> window.onload = function(){ var oP = document.getElementsByTagName('p')[0]; var i = 0; // alert(oP.innerHTML = ++i + 2) 从这里弹窗初始的typeof innerHTML 和 ++i 运算之后的就很清楚. setInterval(updateNum, 1000); updateNum(); // 复习一下定时器怎么调用的!! function updateNu…
<script> window.onload = function(){ var aInp = document.getElementsByTagName('input'); var oSum = document.getElementsByTagName('span')[0]; var oBtn = document.getElementsByTagName('button')[0]; for (i = 0; i < aInp.length; i++) { aInp[i].onkeyu…
<script> window.onload = function() { var oBtn = document.getElementsByTagName('input')[0]; var oUl = document.getElementsByTagName('ul')[0]; var aLi = oUl.getElementsByTagName('li'); oBtn.onclick = function() { // oUl.style.display = 'block'; // 这里…
总结: 1. 点击按钮,div内部变色,边框保持颜色不变. 实现原理:其实本来就把background 和 border 分别设置了同一个颜色,看似是一个整体,其实本来就是分开的. 那么点击的时候,只需要更改background 的颜色.  border 部分不需要设置. 2. for in  循环,遍历数组的用法: for(var p in oSkin) oSkin[p].className = ""; 等价于下面的代码: for(var i=0; i<aDiv.length;…
总结: 1. 注意body里的结构安排,全部装在大div,避免多次设置不同部分居中. 2. 一排按钮居中:装在大div里,text-align: center; 3. 把相同的部分封装成函数,即 同个 oDiv,都是attr 属性 设置 value. var changeStyle = function (elem, attr, value) { elem.style[attr] = value }; 4. 用数组的方式,把每个要设置的attr 和 对应的 value 装起来,直接到数组里用th…