<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<img src="../img/pic1.gif" alt="" name="pic">
<img src="../img/pic2.jpg" alt="" name="pic1">
<form action="" name="register">
<input type="text" placeholder="用户名" />
<input type="text" placeholder="密码不少于8位" />
<button>提交</button>
</form>
<p><a href="http://www.php.cn" name="php">php中文网</a></p>
</body>
<script>
//以文档对象的方式来访问这些特定的元素集合
//document.images 获取所有的<img>元素，返回是一个数组
document.images[0].style.width = '500px'; //标签的数字索引
document.images['pic1'].style.width = '800px'; //name属性
//如果将images看成对象，name就可以看成属性
document.images.pic.style.width = '250px'; //name作为images对象的元素属性
//forms属性 获取页面中所有<form>
document.forms[0].style.background = 'pink';
document.forms['register'].style.background = 'yellow'
document.forms.register.style.background = 'red'
document.forms.item(0).style.background = 'gray' //元素的集合item方法
//links属性 获取页面中所有<a>
document.links[0].style.background = 'pink';
document.links['php'].style.background = 'yellow';
document.links.php.style.background = 'red';
document.links.item(0).style.background = 'gray';
//body属性 获取页面中<body>
document.body.style.background = 'yellow';
//head属性 获取页面中<head>
var style = document.createElement('style');
document.head.appendChild(style);
//documentElement 获取页面中<html>
console.log(document.documentElement);
//doctype 获取文档类型
console.log(document.doctype);
</script>
</html>
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
Collection
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
