javascript控制DOM对象

1.获取元素getElementById()

语法：document.ElementById("id");

注解：获取的元素是一个对象，如果想对元素进行操作，要通过它的属性或方法

2.属性innerHTML

语法：Object.innerHTML

注意：Object是获取的元素对象，如通过getElementById()..

实例：

<h2 id="con">javascript</H2>
<p> JavaScript是一种基于对象、事件驱动的简单脚本语言，嵌入在HTML文档中，由浏览器负责解释和执行，在网页上产生动态的显示效果并实现与用户交互功能。</p>
<script type="text/javascript">
  var mychar= document.getElementById("con")          ;
  document.write("原标题:"+mychar.innerHTML+"<br>"); //输出原h2标签内容
  
  document.write("修改后的标题:"+mychar.innerHTML); //输出修改后h2标签内容
</script>

3.改变html样式

语法：Object.style.proterty = new style;

注意：Object是获取元素的对象

基本属性(property)：backgroundColor设置元素背景颜色、color设置本文颜色、font设置所有字体属性、fontsize设置字体大小等...

实例：

<p id="p">Hello World!</p>
<script>
   var mychar = document.getElementById("p");
   mychar.style.color="red";
   mychar.style.fontSize="20";
   mychar.style.backgroundColor ="blue";
</script>

4.显示和隐藏属性display

语法：Object.style.display = value;

value取值：none此元素不会被现实；block此元素以块级元素显示

5.控制类名className属性

语法：Object.className = classname;

function add(){
	      var p1 = document.getElementById("p1");
	      p1.className = "two";
	   }