DOM基础。

今天老师给我们讲了DOM的基础与应用，这部分相比起来还是很重要的。课后要进行整理，并且多加练习。

<body>
		<div id="div1"></div>
		<div class="div2"></div>
	</body>
</html>
<script>
DOM  Document Object Model 文档对象模型
第一步:取对象
var div1 = document.getElementById('div1');
var div2 = document.getElementsByClassName('div2')[0];
var div3 = document.getElementsByTagName()//标签选择器
var div4 = document.getElementsByName()name//选择器
alert(div1); //object HTMLDivElement
第二步:操作对象
1,改内容
	div1.innerHTML = "<b>加粗</b>"
	div2.innerText = "<b>加粗</b>";
2,改样式
	div1.style.color = "red";
	div1.style.fontFamily = "华文彩云";
3,改属性
	div1.setAttribute('class','class1')
	div1.removeAttribute('style');
4,加事件
	div1.onclick = function(){
		alert("点击事件触发");
		div1.setAttribute('class','class2');
	}
	
	
	
	
造元素
	var new_div = document.createElement('div');
        改样式/改内容.....
	new_div.innerHTML = "新元素";
	document.body.appendChild(new_div);//增加
	document.body.removeChild(new_div);//删除
</script>

posted on 2017-09-25 21:21  小败哥哥。  阅读(67)  评论(0)  编辑  收藏  举报

导航