面向对象认识JS世界-BOM对象

面向对象认识JS-BOM

window

任何我们定义的全局变量 函数 对象等都会成为window对象的属性

document其实是window对象的属性

window的方法:

 1.window.parseInt('123')      /*123*/   parseInt将其他类型数据转换成整数,转换失败就返回NaN

 2.window.parseInt('1.23')   /*1.23*/    parseFloat将其他类型数据转换成小数,转换失败就返回NaN

    /*isNaN 确定某个数值是否可以参与运算*/
    isNaN(123)   /*123可以参与运算,不是NaN,返回false*/

  

 /*eval 会将字符串当做js代码执行*/
    eval('var num=2')
    console.log(num+2)  /*结果是4*/

 

    //    我们可以控制窗口的各种属性:
    //    宽为100,高为400,距屏顶0象素,屏左0象素,无工具条,无菜单条,无滚动条,
    //    不可调整大小,无地址栏,无状态
        window.open ('http://www.baidu.com','newwindow','height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no') 

 

Location

location基础

window.location ='test.html'

刷新当前页面

location.reload()

query基础

1.document.location.href 返回完整的 URL

如:http://www.cftea.com/foo.asp?p=1,

2.location.search是从当前URL的?号开始的字符串

如:http://www.51js.com/viewthread.php?tid=22720,它的search就是?tid=22720

    function simpleQuery(){
        var params= window.location.search;//params:?id,date
        var arr = params.substring(1).split(",");
        return arr;
    }

query基础2 

切割字符串为数组

    var str = window.location.search.substring(1);//获取查询字符串,即"id=1&name=location"的部分
    var arr = str.split("&");//以&符号为界把查询字符串分割成数组

将带有参数url转成json对象格式

var json={num:1,id:1}

    var querystring = function() {//获取URL查询字符串参数值的通用函数
        var str = window.location.search.substring(1);//获取查询字符串,即"id=1&name=location"的部分
        var arr = str.split("&");//以&符号为界把查询字符串分割成数组
        var json = {};//定义一个临时对象
        //遍历数组
        for(var i=0;i<arr.length;i++) {
            var c = arr[i].indexOf("=");//获取每个参数中的等号小标的位置
            if(c==-1) continue;//如果没有发现测跳到下一次循环继续操作


            var d = arr[i].substring(0,c);  //截取等号前的参数名称,这里分别是id和name
            var e = arr[i].substring(c+1);  //截取等号后的参数值
            json[d] = e;//以名/值对的形式存储在对象中
        }
        return json;//返回对象
    }
var f = querystring();//调用查询字符串函数


开打链接的四种方式

1.window.location = "http://www.baidu.com";
2.location.href = "http://www.baidu.com";
3.location.assign("http://www.baidu.com");
4.ocation.replace("http://www.baidu.com");

replace和assign的区别

replace()方法所做的操作与assign()方法一样,但它多了一步操作,即从浏览器的历史记录中删除了包含脚本的页面,这样就不能通过浏览器的后退按钮和前进按钮来访问它了。
assign()方法却可以通过后退按钮来访问上个页面

刷新页面

重新加载当前文档reload()

        location.reload(true);    //从服务器重载当前页面
        location.reload(false);   //从浏览器缓存中重载当前页面
        location.reload();        //从浏览器缓存中重载当前页面

hash:如果URL中包含有“#”,该方法将返回该符号之后的内容
(例如:http://www.itcast.cn/index.html#welcome的hash是“#welcome”)。

host:服务器的名字,例如www.itcast.cn

hostname:通常等于host,有时会省略前面的www。

href:当前页面载入的完整URL。

pathname:URL中主机名之后的部分。

例如:http://www.itcast.cn/html/js/index.html的pathname是“/html/js/index.html”。

port:URL中声明的请求端口。默认情况下,大多数URL没有端口信息(默认为80端口),所以该属性通常是空白的。

像http://www.itcast.cn:8080/index.html这样的URL的port属性为8080。  

protocol:URL中使用的协议,即双斜杠(//)之前的部分。

例如http://www.itcast.cn中的protocol属性是http:

      ftp://www.itcast.cn的protocol属性等于ftp:。

search:执行GET请求的URL中的问号?后的部分,又称查询字符串。

?Id=1&num=1

例如http://www.itcast.cn/search.html?name=shukui中的search属性为?name=shukui。

 


 

history

回退:history.back();

  window.history.go(1),window.history.go(-1)

前进:history.forward();

利用userAgent属性判断是哪个浏览器

function CheckBrowser(){
        var u_agent = navigator.userAgent;
        var browser_name='未知浏览器';
        if(u_agent.indexOf('Firefox')>-1){
            browser_name='Firefox';
        }else if(u_agent.indexOf('Chrome')>-1){
            browser_name='Chrome';
        }else if(u_agent.indexOf('Trident')>-1&&u_agent.indexOf('rv:11')>-1){
            browser_name='IE11';
        }else if(u_agent.indexOf('MSIE')>-1&&u_agent.indexOf('Trident')>-1){
            browser_name='IE(8-10)';
        }else if(u_agent.indexOf('MSIE')>-1){
            browser_name='IE(6-7)';
        }else if(u_agent.indexOf('Opera')>-1){
            browser_name='Opera';
        }else{
            browser_name+=',info:'+u_agent;
        }
        document.write('浏览器类型为:'+browser_name+'<br>');
        document.write('userAgent属性值为:'+u_agent+'<br>');
    }
CheckBrowser()

<!--document 对象集合-->
<!--document 对象集合得到的是一个数组,他们提供了对全体 HTML 元素或特定元素的访问-->


  Error

常用方法和属性
try {
alert(‘’)
}
catch(e) {
e.message
}

 


Navigator

常用方法和属性

appCodeName浏览器的代码名

appName浏览器名

ppVersion浏览器版本号

userAgent浏览器名和版本号

platform浏览器平台

Win32", "Win16", "WinCE", "Mac68k", "MacPPC", "HP-UX", "SunOS" 等

cpuClass CPU的信息 "x86“

online 浏览器是否处于联网状态

cookieEnabled  cookie是否可用


 Screen

常用方法和属性

 

转载于:https://www.cnblogs.com/Abner5/p/6781971.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值