浏览器对象
0. window
1. navigator
document.write('<p>浏览器名称:',navigator.appName,'</p>') document.write('<p>浏览器次名称:',navigator.appCodeName,'</p>') document.write('<p>浏览器版本和系统平台:',navigator.appVersion,'</p>') document.write('<p>浏览器次要版本:',navigator.appMinorVersion,'</p>') document.write('<p>浏览器语言:',navigator.browserLanguage,'</p>') document.write('<p>浏览器系统的 CPU 等级:',navigator.cpuClassd,'</p>') document.write('<p>浏览器否处于脱机模式:',navigator.onLine,'</p>') document.write('<p>运行浏览器的操作系统和(或)硬件平台:',navigator.platform,'</p>') document.write('<p>浏览器用于 HTTP 请求的用户代理头的值:',navigator.userAgent,'</p>')
2. Screen
3. History
4. Location
html dom 对象
node type
节点类型 | 数值常量 | 字符常量 |
---|---|---|
Element元素节点 | 1 | ELEMENT_NODE |
Attr属性节点 | 2 | ATTRIBUTE_NODE |
Text文本节点 | 3 | TEXT_NODE |
Comment注释节点 | 8 | COMMENT_NODE |
Document文档节点 | 9 | DOCUMENT_NODE |
DocumentType文档类型节点 | 10 | DOCUMENT_TYPE_NODE |
DocumentFragment文档片段节点 | 11 | DOCUMENT_FRAGMENT_NODE |
节点的nodeName and nodeValue
节点类型 | nodename | nodevalue |
---|---|---|
Element元素节点 | 元素的标签名 (DIV) | null |
Attr属性节点 | 属性名(id) | 属性值 |
Text文本节点 | #Text | 节点所包含的文本(包含空白换行) |
Comment注释节点 | #comment | 注释内容 |
DocumentType文档类型节点 | docutype的名称 | null |
DocumentFragment文档片段节点 | #documentfragment | null |
1. document选择器
### 属性 // 属性 var title = document.title var domain = document.domain var url = document.URL var referrer = document.referrer var cookie = document.cookie var lastmodified = document.lastModified console.log('title: ',title) console.log('domain: ',domain) console.log('url: ',url) console.log('referrer: ',referrer) console.log('cookie: ',cookie) console.log('lastmodified: ',lastmodified) ### 对象方法 // NodeList 对象代表一个有顺序的节点列表,可通过节点列表中的节点索引号来访问列表中的节点(索引号由0开始) var getid = document.getElementById('login') //id var getname = document.getElementsByName('input-text') //name属性 var gettagname = document.getElementsByTagName('p') //html标签 var classname = document.getElementsByClassName('search-box') //class属性 console.log('id: ',getid.innerText) console.log('name :',getname[0].innerText) console.log('tagname :',gettagname[2].innerText) console.log('classname: ',classname[0].innerText)
2. 小例子
点击+1
<div> <p id='num'>1</p> <input type="button" value='+1' onclick='AddNum();'> </div> <script> function AddNum(){ var p = document.getElementsByTagName('p') var num = p[0].innerText var num = parseInt(num) + 1 p[0].innerText = num } </script>
搜索提示框
<!-- 搜索框 --> <div class='search-box'> <form action=""> <input id='input-text' type="text" value='请输入关键词' onFocus='CleanText();' onblur='Retext();'/> <!-- <input class='input-submit' type="submit"> --> </form> </div> <script> function CleanText(){ var text = document.getElementById('input-text'); if(text.value.trim() =='请输入关键词'){ text.value = ''; } } function Retext(){ var text = document.getElementById('input-text'); if(!value.trim()){ text.value = '请输入关键词'; } } </scirpt>
滚动title
<script> var title = document.title; console.log(title.charAt(0)); function Rolling(){ var title = document.title; var first = title.charAt(0); var end = title.substring(1,title.lenth); var newTitle = end + first; document.title = newTitle; } myInterval = setInterval("Rolling()",500) </script>
滚动内容
<div> <h1>h1标签 滚动测试</h1> </div> <script> function Rolling(){ var content = document.getElementsByTagName('h1'); var text = content[0].innerText var first = text.charAt(0); var end = text.substring(1,text.lenth); var newContent = end + first; content[0].innerText = newContent; } MyInterval = setInterval('Rolling();',500) </script>