BOM
今天学了js的一些特效和属性原理,首先在<head></head>中建个IDdiv,那么他在js中就这么写格式:
var d1=document.getElementById("d1");
d1.innerHTML="";
在这里学到了和以前有关的知识,比如style属性了,接下来就可以应用了,首先我们可以给字体添加大小,颜色,以及边框:
d1.style="font-size:50px;"
d1.style.color="red";
d1.style.border="1px solid black;"
alert(d1.style.width);
说到选择器这个东西,有id选择器,就有class选择器,所以接下来就是class选择器:
var d2 = document.getElementsByClassName("d2")[0];
d2.innerHTML="ABCDEF";
然后就是标签选择器以及innerHTML和innerTEXT的区别:
var d3=document.getElementsByTagName("span")[0];
d3.innerText="XYZ</br>IJK"
期中innertext是把=后面的所有内容都变成文本输入进去,而html是能将标签读取,比如加入</br>他就会换行。
在这里面有很多特效,特效代码前面要加on,比如onclick鼠标选定的时候,onmouseover鼠标一上去的时候,onmouseout,鼠标离开的时候。
注册表很多时候下面有个你必须点同意条款才能进行下一步,那么那个是怎么做的呢,代码如下:
<body>
<input type="checkbox" id="ckb" /><label for="ckb">同 意</label>
<input id="btn" type="button" value="下一步" disabled="disabled" />
</body>
<script>
var ckb = document.getElementById("ckb");
var btn = document.getElementById("btn");
ckb.onchange = function(){
var status = ckb.checked;
if(status == true){
btn.removeAttribute("disabled");
}else{
btn.setAttribute("disabled","disabled");
}
}
</script>
还有将一个text中的内容添加到下拉框中的:
<body>
<select id="slt" size="7" style="width: 100px;">
<option>abc</option>
<option>123</option>
</select>
<input type="text" id="txt" />
<input type="button" id="btn" value="添加" />
</body>
<script>
var btn = document.getElementById("btn");
var txt = document.getElementById("txt");
var slt = document.getElementById("slt");
btn.onclick = function(){
// alert(txt.value);
var opt = document.createElement("option");
opt.innerText = txt.value;
slt.appendChild(opt);
txt.value = "";
}.