您的位置：首页 > Web前端 > JavaScript

js的DOM操作

2012-11-21 15:20 218 查看

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title> new document </title>

<meta name="generator" content="editplus" />

<meta name="author" content="" />

<meta name="keywords" content="" />

<meta name="description" content="" />

<script type="text/javascript">

function showDiv(){

//DOM js的DOM操作，类似于php DOM操作XML

//创建一个元素，参数是元素名

var new_div = document.createElement('div');

//给div设置大小和颜色,通过他的style属性来获得.但是设置具体的某个属性还是要根据具体的属性名来设置

new_div.style.width = '100px';

new_div.style.height = '100px';

//如果某个属性是由多个但是组成的话，采用驼峰发

new_div.style.backgroundColor = 'red';

new_div.id='div1';

//确定位置

document.body.appendChild(new_div);

var text = document.createTextNode('abcd');

new_div.appendChild(text);

alert(document.getElementById('div1').nodeName);

}

</script>

<input type="button" onclick="showDiv()" value="click">

</head>

<body>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航