摘要:
![手面正面](images/phonefront.png)
![手面正面](images/phonefront.png)
//----javascript----
//同时修改盒子属性、内容
function InsContent($param){
$param.style.borderRadius = "150px"; //定义函数改成盒子属性,点击盒子转变成圆角
$param.style.background='#FF99CC'; //调整盒子背景颜色
$param.style.width="150px"; //调整盒子宽度
$param.style.height="150px"; //调整盒子高度
$param.style.textAlign='center'; //调整盒子内容居中
$param.style.lineHeight='150px'; // 调整盒子内容行高
$param.style.color='blue'; //调整盒子文本颜色
$iparam = document.getElementById('box1');//根据ID获取到指定的标签 ,进而修改标签内容
$iparam.innerHTML = "我加进来了!";
}
//图片切换,切记图片标签是属于内容,不属于样式,如果是背景图片才需要使用x.style.backgroundImages;document.getElementById("idname")."属性"="属性值"
function imgchange(x){
x=document.getElementById('phonehover');
x.src="images/phoneback.png"
}
function ChangeRed(){
var x = document.getElementsByClassName('box2');//根据getElementByClassName获取的是一个《数组》, 需要遍历执行变动,这点授课老师没讲到;
var i;
for (i = 0; i < x.length; i++) {
x[i].style.backgroundColor = "red";
x[i].innerHTML = "我变红啦!";
}
}
function ChangeWhite(){
var x = document.getElementsByClassName('box2');//根据getElementByClassName获取的是一个《数组》, 需要遍历执行
var i;
for (i = 0; i < x.length; i++) {
x[i].style.backgroundColor = "white";
x[i].innerHTML = "我又变白色啦"
}
}
批改老师:欧阳批改时间:2019-04-19 09:14:57
老师总结:完成的不错,每行js代码都要增加;号。你好像习惯最后一行不加。继续加油。