原生JS常用API整理
Anchor 对象：指HTML超链接
1.修改一个链接的文本，链接和target
//html部分
访问 Microsoft
改变超链接的文本和 URL。也改变 target 属性。target 属性的默认设置是 "_self"，这意味着会在相同的窗口中打开链接。通过把 target 属性设置为 "_blank"，链接将在新窗口中打开。
//js部分
function changeLink(){
document.getElementById(‘myAnchor’).innerHTML=“访问 W3School"
document.getElementById(‘myAnchor’).href=“
document.getElementById(‘myAnchor’).target=”_blank”
}
Document 对象：指 页面文档文本
1.document输出流输出 文本 或者 HTML
document.write(“Hello World!”) //Hello World
document.write(“
Hello World!
”) //带h1标签效果的 Hello Worlddocument.write(document.title) //返回当前页面的标题
document.write(document.URL) //返回当前页面的URL
document.URL , document.referrer , location.href 的区别：
①. 从输出结果上，document.URL 和 windows.location.href 没有区别。
②. 非要说区别的话，你只可以读取document.URL的值，不能修改它。windows.location.href的值你即可以读取也可以修改，可以使用它进行页面跳转。
③. referrer则是返回前一个来源页面的URL，并不是当前页面。
2.元素选择
第一个返回选中id，其余则是返回一个数组
document.getElementById()
document.getElementsByName()
document.getElementsByClassName()
document.getElementsByTagName()
Event 对象
1.获取鼠标的按键，返回按键索引 event.button
请在文档中点击鼠标。一个消息框会提示出您点击了哪个鼠标按键。
2.获取光标的坐标 event.clientX x=event.clientX y=event.clientY //获取光标的位置Y轴 3.获取按键码 event.keyCode您喜欢哪款浏览器？
Firefox
Netscape
Opera
您喜欢的浏览器是： 3.form表单相关 ①reset()可以清空表单数据 ②submit()可以提交表单
function formReset(){
document.getElementById(“myForm”).reset()
}
document.getElementById(“myForm”).submit()
document.getElementById(‘text1’).focus() //获取焦点
document.getElementById(‘text1’).blur() //失去焦点
在下面的文本框中输入一些文本，然后点击重置按钮就可以重置表单。
姓名：Location 对象 window.location="/index.html" //基于原有域名下的页面跳转 window.location.reload(); //重载页面 window.location , window.location.href , window,location.replace的区别 window.location是页面的位置对象，页面基于域名后添加新增的url跳转 window.location.href是 location的一个属性值，页面替换url跳转 如果需要打开新窗口，使用window.open('')方法
有3个页面 a,b,c
如果当前页面是c页面，并且c页面是这样跳转过来的：a->b->c
1：b->c 是通过window.location.replace("…xx/c") 此时b页面的url会被c页面代替，并且点击后退按钮时会回退到a页面（最开始的页面）
2：b->c是通过window.location.href("…xx/c") 此时b页面的路径会被c页面代替，但是点击回按钮后页面回退的是b页面
两者的区别: 两者后退时所回退的页面不一样
Navigator 对象
用于检测和获取浏览器相关信息
navigator.appName //appname
navigator.appVersion //浏览器的版本信息
naviigator.appCodeName //浏览器代码
navigator.cookieEnabled //是否启用了cookie
navigator.userAgent //浏览器的用户代理报头
Option 和 Select 对象
启用与禁用select
document.getElementById(“mySelect”).disabled=true
document.getElementById(“mySelect”).disabled=false
设置可以选取多个option
document.getElementById(“mySelect”).multiple=true
更改选择项
document.getElementById(“orange”).selected=true;
window 对象
window.open() //打开新窗口
window.location //在域名后追加地址进入新页面
window.location.href //页面地址
window.location.reload() //页面重载
window.print() //打印页面
window.scrollTo(100,500) //窗口滚动到指定位置
共同學習，寫下你的評論
評論加載中...
作者其他優質文章
