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   小败哥哥。  阅读(67)  评论(0编辑  收藏  举报

导航

< 2025年1月 >
29 30 31 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31 1
2 3 4 5 6 7 8
点击右上角即可分享
微信分享提示