爱站程序员基地学JavaScript的第一天
JavaScript是web开发者必学的一种语言，HTML定义网页内容，css定义网页布局，JavaScript对网页进行编程。
第一段JavaScript
<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>第一段Javascript</title></head><body><h1>我的第一段Javascript</h1><button type=\"button\" onclick=\"document.getElementById(\'demo\').innerHTML =Date()\"> 点击这里显示日前和时间</button><p id=\"demo\"></p></body></html>
JavaScript能改变HTML内容
<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>Javascript改变html内容</title></head><body><p id=\"demo\">Javascript能够改变HTML内容</p><button type=\"button\" onclick=\'document.getElementById(\"demo\").innerHTML=\"Hello Javascript\"\'>点我改变内容</button></body></html>
JavaScript能改变图片的src属性值
<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>Javascript能改变图像src属性值</title></head><body><img id=\"myImage\" border=\"0\" src=\"../img/one.png\" style=\"text-align: center;\"><div><button onclick=\"document.getElementById(\'myImage\').src=\'../img/one2.png\'\">点击开灯</button><button onclick=\"document.getElementById(\'myImage\').src=\'../img/one.png\'\">点击关灯</button></div></body></html>
JavaScript能改变css样式
<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>Javascript能改变css样式</title></head><style>.demo{font-size: 10px;}</style><body><p id=\"demo\">Javascript能改变css样式</p><button type=\"button\" onclick=\"document.getElementById(\'demo\').style.fontSize=\'35px\'\">点击改变css样式</button></body></html>
JavaScript能显示和隐藏html元素
<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>Javascript能显示隐藏HTML元素</title></head><body><p id=\"demo\">Javascript能显示隐藏HTML元素</p><button type=\"button\" onclick=\"document.getElementById(\'demo\').style.display=\'none\'\">点击隐藏</button><button type=\"button\" onclick=\"document.getElementById(\'demo\').style.display=\'block\'\">点击显示</button></body></html>
