获取页面标签 - 会coding的HAM

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>获取页面标签</title>
<style>
body{
width: 100%;
height: 100%;
background-color: beige;
}
</style>
</head>
<body>
<script>
// 获取body标签样式
// document.body.style.margin = '0px'
// document.body.style.height = '100%'
// document.body.style.border = '5px solid black'
// 获取html标签并设置样式
// var html =document.getElementsByTagName('html')[0]
// html.style.height = '100%'
// var a =document.documentElement
// documentElement 返回文档的根节点
// a.style.backgroundColor = 'red'
document.title = '存款收益计算器'
// title 返回当前文档的标题
var header =document.createElement('header')
header.innerText = '存款收益计算器'
header.style.height = '50px'
header.style.backgroundColor = '#f93'
header.style.color = 'white'
header.style.fontSize = '18px'
header.style.lineHeight = '50px'
header.style.textAlign = 'center'
document.body.appendChild(header)
// console.log(document.all)
// 获取页面上所以元素标签
// 能把标签元素的树形结构变成线性结构
// 在循环处理时很方便尽可能把 document.all 放在所以创建元素的代码之后
// 否则有些标签可能还没创建出来
// 实现类似样式中的 *{box-sizing: border-box}
// for(var i = 0;i < document.all.length;i++){
// var ele = document.all[i]
// if(ele.tagName == 'SCRIPT')continue
// if(ele.tagName == 'HTML')continue
// if(ele.style){
// ele.style.boxSizing = 'border-box'
// }
// }
// document.links
// 获取页面上所有link 即<link>
// document.images
// 获取页面上所有图片即<img>
// document.forms
// 获取页面上所有表单即<form>
// document.anchors
// 获取页面上的所有超链接即<a>
// document.applets
// 获取嵌入到页面上的Java小程序从来没有在互联网上广泛使用早已绝迹江湖
// document.embeds
// 嵌入到页面上的flash
// document.styleSheets
// 获取页面上的所有样式表
// document.scripts
// 获取页面上的所有脚本即<script>
</script>
</body>
</html>

发送评论编辑评论

发送评论 编辑评论

推荐文章

发送评论编辑评论