<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Welcome!</title> <script type="text/javascript" language="Javascript"> addOnload(initOne); addOnload(initTwo); addOnload(initThree); function addOnload(newFunction) { var oldOnload = window.onload; //如果加载的类型是function则加载该oldOnload否则加载新的function if (typeof oldOnload == "function") { window.onload = function() { if (oldOnload) { oldOnload(); } newFunction(); } } else { window.onload = newFunction; } } function initOne() { //给页面元素添加样式 document.getElementById("pageBody").style.backgroundColor = "#ccc"; } function initTwo() { //给页面元素添加样式 document.getElementById("pageBody").style.color = "#FF0000"; } function initThree() { var allTags = document.getElementsByTagName("*"); for (var i=0; i<allTags.length; i++) { if (allTags[i].nodeName == "H1") { allTags[i].style.border = "5px green solid"; allTags[i].style.padding = "25px"; allTags[i].style.backgroundColor = "#FFFFFF"; } } } </script> </head> <body id="pageBody"> <h1>Welcome to our Web site!</h1> </body> </html>
使用js给页面元素添加样式
作者:沐雪
文章均系作者原创或翻译,如有错误不妥之处,欢迎各位批评指正。本文版权归作者和博客园共有,如需转载恳请注明。
如果您觉得阅读这篇博客让你有所收获,请点击右下方【推荐】
找一找教程网-随时随地学软件编程 http://www.zyiz.net/