精华内容
下载资源
问答
  • 简单来说,document是window的一个对象属性Window 对象表示浏览器中打开窗口。 如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外 ...

     

    简单来说,document是window的一个对象属性。
    Window 对象表示浏览器中打开的窗口。
    如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。
    所有的全局函数和对象都属于Window 对象的属性和方法。
    document   对 Document 对象的只读引用。
    
    [window对象]
    
      它是一个顶层对象,而不是另一个对象的属性,即浏览器的窗口。
    
      属性
    
      defaultStatus 缺省的状态条消息
    
      document 当前显示的文档(该属性本身也是一个对象)
    
      frame 窗口里的一个框架((FRAME>)(该属性本身也是一个对象)
    
      frames array 列举窗口的框架对象的数组,按照这些对象在文档中出现的顺序列出(该属性本身也是一个
    
    对象)
    
      history 窗口的历史列表(该属性本身也是一个对象)
    
      length 窗口内的框架数
    
       location 窗口所显示文档的完整(绝对)URL(该属性本身也是一个对象)不要把它与如document.location
    
    混淆,后者是当前显示文档的URL。用户可以改变window.location(用另一个文档取代当前文档),但却不能改变
    
    document.location (因为这是当前显示文档的位置)
    
      name 窗口打开时,赋予该窗口的名字
    
      opener 代表使用window.open打开当前窗口的脚本所在的窗口(这是Netscape Navigator 3.0beta 3所引
    
    入的一个新属性)
    
      parent 包含当前框架的窗口的同义词。frame和window对象的一个属性
    
      self 当前窗口或框架的同义词
    
      status 状态条中的消息
    
      top 包含当前框架的最顶层浏览器窗口的同义词
    
      window 当前窗口或框架的同义词,与self相同
    
      方法
    
      alert() 打开一个Alert消息框
    
      clearTimeout() 用来终止setTimeout方法的工作
    
      close() 关闭窗口
    
       confirm() 打开一个Confirm消息框,用户可以选择OK或Cancel,如果用户单击OK,该方法返回true,单击
    
    Cancel返回false
    
       blur() 把焦点从指定窗口移开(这是Netscape Navigator 3.0 beta 3引入的新方法)
    
      focus() 把指定的窗口带到前台(另一个新方法)
    
      open() 打开一个新窗口
    
       prompt() 打开一个Prompt对话框,用户可向该框键入文本,并把键入的文本返回到脚本
    
      setTimeout() 等待一段指定的毫秒数时间,然后运行指令事件处理程序事件处理程序
    
      Onload() 页面载入时触发
    
      Onunload() 页面关闭时触发
    
    [document 对象]
    
      该对象是window和frames对象的一个属性,是显示于窗口或框架内的一个文档。
    
      属性
    
      alinkColor 活动链接的颜色(ALINK)
    
      anchor 一个HTMI锚点,使用<A NAME=>标记创建(该属性本身也是一个对象)
    
      anchors array 列出文档锚点对象的数组(<A NAME=>)(该属性本身也是一个对象)
    
      bgColor 文档的背景颜色(BGCOLOR)
    
      cookie 存储于cookie.txt文件内的一段信息,它是该文档对象的一个属性
    
      fgColor 文档的文本颜色(<BODY>标记里的TEXT特性)
    
      form 文档中的一个窗体(<FORM>)(该属性本身也是一个对象)
    
      forms anay 按照其出现在文档中的顺序列出窗体对象的一个数组(该属性本身也是一个对象)
    
      lastModified 文档最后的修改日期
    
      linkColor 文档的链接的颜色,即<BODY>标记中的LINK特性(链接到用户没有观察到的文档)
    
      link 文档中的一个<A HREF=>标记(该属性本身也是一个对象)
    
      links array 文档中link对象的一个数组,按照它们出现在文档中的顺序排列(该属性本身也是一个对象)
    
      location 当前显示文档的URL。用户不能改变document.location(因为这是当前显示文档的位置)。但是,
    
    可以改变 window.location (用其它文档取代当前文档)window.location本身也是一个对象,而
    
    document.location不是对象
    
      referrer 包含链接的文档的URL,用户单击该链接可到达当前文档
    
      title 文档的标题((TITLE>)
    
      vlinkColor 指向用户已观察过的文档的链接文本颜色,即<BODY>标记的VLINK特性
    
      方法
    
      clear 清除指定文档的内容
    
      close 关闭文档流
    
      open 打开文档流
    
       write 把文本写入文档
    
      writeln 把文本写入文档,并以换行符结尾
    
    区别:1、window 指窗体。document指页面。document是window的一个子对象。
    
        2、用户不能改变 document.location(因为这是当前显示文档的位置)。但是,可以改变window.location (用其它文档取代当前文档)window.location本身也是一个对象, 而document.location不是对象

    alert($(window).height()); //浏览器时下窗口可视区域高度

    alert($(document).height()); //浏览器时下窗口文档的高度

    alert($(document.body).height());//浏览器时下窗口文档body的高度

    alert($(document.body).outerHeight(true));//浏览器时下窗口文档body的总高度 包括border padding margin

    alert($(window).width()); //浏览器时下窗口可视区域宽度

    alert($(document).width());//浏览器时下窗口文档对于象宽度

    alert($(document.body).width());//浏览器时下窗口文档body的高度

    alert($(document.body).outerWidth(true));//浏览器时下窗口文档body的总宽度 包括border padding margin  

    alert($(document).scrollTop()); //获取滚动条到顶部的垂直高度

    alert($(document).scrollLeft()); //获取滚动条到左边的垂直宽度



















    转载于:https://www.cnblogs.com/gluncle/p/8117967.html

    展开全文
  • ① window对象(Math方法也属于window对象): window对象是JavaScript中顶级对象,所有定义在全局作用域中变量、函数都会变成window对象的属性和方法,window对象下的属性和方法调用时候可以省略window ...

    window对象(Math方法也属于window对象):

    window对象是JavaScript中的顶级对象,所有定义在全局作用域中的变量、函数都会变成window对象的属性和方法,window对象下的属性和方法调用的时候可以省略window

    例如:window.alert();  window.console;  window.document

    BOM中的常用对象、事件

    1onload事件

    window.onload 所有资源加载完成再执行onload里面的代码,包括外部资源(图片、样式、脚步)等都加载完成。如果重复绑定该事件,后面的事件会覆盖前面绑定的事件,需要封装一个onload追加函数,如下:

     function addWindowOnload (fn) {

        var onload = window.onload;

        if (typeof onload === "function") {

            window.onload = function () {

                onload();

                fn();

            }

        } else {

            window.onload = fn;

        }

    }

    2open相关事件

    window.open(“http://www.baidu.com” , str) 打开页面,第二个参数str如果是”_self”表示在当前窗口打开页面,如果是”_blank”表示在空白窗口打开页面。该方法会有一个返回值,返回的是打开页面的window对象

    window.close() 关闭页面,哪个页面的window对象调用就关闭哪个页面

    3location对象

    window.location.href = “http://www.baidu.com”跳转页面到指定页面

    window.location.reload( ) 重新加载页面

    window.location.hash 锚点

    window.location.host 服务器  服务器名+端口号

    window.location.hostname 服务器名

    window.location.pathname 路径名

    window.location.port 端口号

    window.location.protocol 协议

    window.location.search 传递的参数

    4navigator对象

    window.navigator.userAgent 获取用户浏览器信息

    5history对象

    window.history.forward( ) 前进浏览记录,相当于点击了浏览器的前进按钮

    window.history.back( ) 后退浏览记录,相当于点击了浏览器的后退按钮

    6screen对象

    window.screen.width/height 屏幕的宽/高

    window.screen.availWidth/availHeight 屏幕的可用宽/高

    7Date时间对象

    new Date() 时间对象

    new Date( ).valueOf( ) 返回一个13位的数字,从1970-1-1  00:00:00:000开始到现在的毫秒值   1486393945133

    new Date().toDateString( )  日期     Mon Sep 06 2016

    new Date().toTimeString( )  时间    23:10:54 GMT+0800(中国标准时间)

    new Date().toLocaleDateString( )   本地的日期    2016/9/6

    new Date().toLocaleTimeString( )   本地的时间    下午11:10:54

    new Date().getTime( )   获取时间,与valueOf()基本相同

    new Date().getSeconds( )  获取时间秒数

    new Date().getMinutes( )  获取时间分钟数

    new Date().getHours( )    获取时间小时数

    new Date().getFullYear( )    获取年份值

    ……..等等

    8)设置定时方法

    setTimeout(function(){ },time) 设置延时定时器,第一个参数是回调函数,写需要执行代码,第二个是延时时间,单位毫秒。会返回一个该定时器的id

    clearTimeout(var) 清理延时定时器

    setInterval(function(){ },time) 设置间歇定时器,第一个参数是回调函数,写需要执行代码,第二个是间歇执行时间,单位毫秒。会返回一个该定时器的id

    clearInterval(var) 清理间歇定时器

    9)获取计算后样式属性getComputedStyle(obj,null)

    可以获取对象的所有样式属性,只要设置了无论是否生效,就能获取该设置的值,没有设置的也能获取其默认值

    例如:

            #content {

                left: 50px;

                width: 10px;

                height: 10px;

            }

        <div id="content"></div>

        var text = document.getElementById("content");

        console.log(getComputedStyle(text,null).left); 打印结果为”50px”,此处left既没有设置position属性,即不能生效,又不是行内样式,即obj.style.left获取不到

    获取计算后样式值函数兼容性写法封装:

    function getStyle(obj, attr) {

        if (window.getComputedStyle) {

            return window.getComputedStyle(obj, null)[attr];

        } else {

            return obj.currentStyle[attr];

        }

    }

    10)页面窗体事件

    a ) 窗体大小发生改变(window.onresize

    window.onresize = function( ) { … }

    获取页面宽高函数兼容性写法封装:

    function client() {

        return {

            width: window.innerWidth || document.documentElement.

                clientWidth || document.body.clientWidth || 0,

            height: window.innerHeight || document.documentElement.

                clientHeight || document.body.clientHeight || 0

        };

    }

    b ) 窗体滚动到指定坐标(window.scrollTo( x , y ))以窗体左上角为坐标计算点

    window.scrollTo( 0 , 500 )

    11)禁止用户选中页面中的内容window.getSelection

    兼容写法:

    window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty()

    BOM中的常用属性

    1offset相关属性(元素)

    offsetHeight 获取元素的自身高度(从边框border开始计算),结果为数值,只读属性无法对样式进行设置,style.height只能获取写成行内样式的高度,结果为包含px的字符串

    offsetWidth 获取元素的自身宽度(从边框border开始计算),结果为数值,只读属性无法对样式进行设置,style.Width只能获取写成行内样式的宽度,结果为包含px的字符串

    offsetParent 距离自身最近的带有定位的父级

    offsetTop自身顶部(从border开始计算)到offsetParent顶部(从padding开始计算,不包含border)的距离。offsetTop是以自身border左上角开始计算,style.top只能获取写成行内样式的top,是以自身margin左上角开始计算,

    offsetLeft 自身左侧(从border开始计算)到offsetParent左侧(从padding开始计算,不包含border)的距离。offsetLeft是以自身border左上角开始计算,style.Left只能获取写成行内样式的left,是以自身margin左上角开始计算,

    2scroll相关属性(元素内部内容,包括padding

    scrollHeight 获取元素内部内容的高度

    scrollWidth 获取元素内部内容的宽度

    scrollTop 获取元素内容被滚动卷去的头部的高度(即内容被滚动后向上移动,容器盒子顶部与其顶部top值的差),一般与onscroll事件联用

    一般制作固定导航栏时,给导航栏滚动后追加固定定位样式(position:fixed)即可

    scrollLeft 获取元素内容被滚动卷去的左侧的宽度,原理与scrollTop相同

    获取页面滚动被卷去值的scroll函数的兼容写法:

    function scroll() {

        return {

            top: window.pageYOffset || document.documentElement.

                scrollTop || document.body.scrollTop || 0,

            left: window.pageXOffset || document.documentElement.

                scrollLeft || document.body.scrollLeft || 0

        };

    }

    3client相关属性:

    (元素border以内可视区域包括:padding+contentpadding以内区域))

    clientHeight 获取元素border以内可视区域的高度

    clientWidth 获取元素border以内可视区域的宽度

    clientTop 等于元素上边框borderTop,即元素上边框的宽度,包括滚动条宽度

    clientLeft 等于元素上边框borderLeft,即元素上边框的宽度,包括滚动条宽度

    4offset scroll client具体解析图示:

    事件对象event

    1)事件函数中传入的参数,可以理解为就是事件对象event

    document.oncilck = function( event ){ console.log(event) } 结果如下:

    可以看到,此参数event打印结果为MouseEvent鼠标事件

    该事件对象具备许多内置属性,展开后结果如下:

    2)事件对象的基本属性

    a ) 三个重要的坐标

    pageX

    光标相对于文档页面的水平位置(存在兼容性)

    pageY

    光标相对于文档页面的垂直位置(存在兼容性)

    clientX

    光标相对于客户区(浏览器window当前窗口)的水平位置

    clientY

    光标相对于客户区(浏览器window当前窗口)的垂直位置

    screenX

    光标相对于用户屏幕的水平位置

    screenY

    光标相对于用户屏幕的垂直位置

    b ) 事件冒泡  注册在子元素上的事件会冒泡到父元素上执行(如点击事件,点击子元素,等同于点击了父元素,父元素绑定的点击事件代码也会执行)

    阻止事件冒泡:event.stopPropagation()

    c ) 事件目标(多用于框架封装)target触发事件的目标(事件的源头)

    document.οnclick= function (event) {

        console.log(event.target)

    }

    d ) 事件监听器:   给相同的对象重复绑定相同事件,不会出现后面事件覆盖前面事件的情况,绑定的代码都会被执行

    添加事件监听器:addEventListener(共有三个参数:事件、执行函数、是否捕获

    btn.addEventListener(“click” , function(){} , false)

    第三个参数传入false,表示不使用捕获,事件执行顺序按照冒泡机制,从子级到父级

    第三个参数传入true,表示使用捕获,事件执行顺序从父级到子级,从外至内

    解除事件监听器:removeEventListener

    btn.removeEventListener(“click” , function(){} , false)

    只解除对象最后一次绑定的事件,之前绑定的该事件不会被解除

    e ) 键盘事件中的键盘码keyCode 按不同键的键盘码不同

    onkeydown = function (event) { console.log( event.keyCode ) }

    onkeydownonkeyup事件使用的都是键盘码

    onkeypress中使用的是ASCII

    3)事件对象及其基本相关属性兼容性写法集合如下:

    var eventUtil = {

        getEvent: function (event) {

            return event || window.event;

        },

        getPageX: function (event) {

            return event.pageX || event.clientX + document.documentElement.scrollLeft;

        },

        getPageY: function (event) {

            return event.pageY || event.clientY + document.documentElement.scrollTop;

        },

        stopPropagation: function (event) {

            if (event.stopPropagation) {

                event.stopPropagation();

            } else {

                event.cancelBubble = true;

            }

        },

        getTarget: function (event) {

            return event.target || event.srcElement;

        }

    };

     

    转载于:https://www.cnblogs.com/Tabb/p/6436358.html

    展开全文
  • ES6中使用let, const声明变量, 在window对象下是获取不到 今天在写demo时候发现, 使用let或者const声明变量, 在window对象下使用this来获取发现获取不到 参考别人文章后发现, 原来es6中,var,function...

    ES6中使用let, const声明的变量, 在window对象下是获取不到的

    • 今天在写demo的时候发现, 使用let或者const声明的变量, 在window对象下使用this来获取发现获取不到
    • 参考别人的文章后发现, 原来es6中,var,function声明的全局变量,仍然属于顶级对象的属性;使用let,const,class声明的全局变量不再属于顶层对象的属性,这意味着es6开始,全局变量和顶层对象的属性开始分离,脱钩。所以我们在window对象里也就找不到let声明的age了。
    let a = "你好";
    const b = "你也好";
    // 这里的this在浏览器环境下指向的是window对象
    // 如果是在node环境下指向的是一个空对象
    console.log(this); // Window
    console.log(this.a); // undefined
    console.log(this.b); // undefined
    
    展开全文
  • 所有全局函数和对象都属于Window对象的属性和方法。区别: 1、window 指窗体。Window 对象表示浏览器中打开窗口。 document指页面。document是window一个子对象、一个对象属性。 2、用户不能改变 document....

    所有的全局函数和对象都属于Window对象的属性和方法。

    区别:
    1、window 指窗体。Window 对象表示浏览器中打开的窗口。
    document指页面。document是window的一个子对象、一个对象属性。

    2、用户不能改变 document.location(因为这是当前显示文档的位置)。
    但是,可以改变window.location (用其它文档取代当前文档)
    window.location本身也是一个对象, 而document.location不是对象。

    如果文档包含框架(frame 或 iframe 标签),浏览器会为HTML文档创建一个window对象,

    并为每个框架创建一个额外的 window 对象。

    document Document 对象的只读引用。document 当前显示的文档(该属性本身也是一个对象)。

    frame 窗口里的一个框架((FRAME>)(该属性本身也是一个对象)。
    frames array 列举窗口的框架对象的数组,按照这些对象在文档中出现的顺序列出(该属性本身也是一个对象)。


    1、window:代表浏览器中一个打开的窗口。它是一个顶层对象,而不是另一个对象的属性。

    (1)对象属性


    (2)对象方法



    (3)成员对象





    2、document对象:代表整个HTML 文档,可用来访问页面中的所有元素。

    (1)对象属性



    (2)对象方法


    (3)body对象


    (4)location-位置子对象


    (5)通过集合引用(以images集合为例,forms集合等类似)


    补充:

    a)通过name属性直接引用

    <img name="oImage" src="">
    document.images.oImage          //document.images.name属性

    ----------------------------
    b)引用图片的src属性

    document.images.oImage.src      //document.images.name属性.src


    参考文章链接:

    https://blog.csdn.net/zhouziyu2011/article/details/61922889

    https://blog.csdn.net/qq_21577869/article/details/46895365


    展开全文
  • Global对象和window对象

    2018-01-23 00:18:53
    Global对象和window对象 Global对象  不属于任何其他对象的属性和方法,最终都是Global对象的属性和方法。如 parseFloat( )、parseInt( )、escape( )、unescape( )、isFinite( )、isNaN( )、eval( )、encodeURI...
  • 简单来说,document是window的一个对象属性Window 对象表示浏览器中打开窗口。 如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外 window ...
  • 从某种意义上讲,它是一个终极“兜底儿对象”,换句话说呢,就是不属于任何其他对象的属性和方法,最终都是它的属性和方法。我理解为,这个global对象呢,就是整个JS“老祖宗”,找不到归属那些“子子孙孙”都...
  • 简单来说,document是window的一个对象属性Window 对象表示浏览器中打开窗口。 如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外 window ...
  • 简单来说,document是window的一个对象属性Window 对象表示浏览器中打开窗口。 如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外 window ...
  • 全局对象属性

    2019-10-07 04:35:26
    全局对象是最顶层的对象,在浏览器环境指的是window对象,在Node.js指的是global对象。在JavaScript语言中,所有全局变量都是全局对象的属性。(Node的情况比较特殊,这一条只对REPL环境适用,模块环境必须显式声明...
  • 从某种意义上讲,它是一个终极“兜底儿对象”,换句话说呢,就是不属于任何其他对象的属性和方法,最终都是它的属性和方法。我理解为,这个global对象呢,就是整个JS“老祖宗”,找不到归属那些“子子孙孙”都...
  • 2.4 顶层对象的属性

    2017-10-25 14:30:05
    1:顶层对象在浏览器环境中指的是window对象;在node环境中指的是global对象; 2:ES6一方面规定:为了保持兼容性,var命令function命令声明的全局变量依旧是顶层对象的属性; 另一方面也规定,let命令、const命令...
  • document是window的一个对象属性Window 对象表示浏览器中打开窗口。 如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外 window 对象。 所有...
  • 顶层对象,在浏览器环境指的是window对象,在 Node 指的是global对象。ES5 之中,顶层对象的属性与全局变量是等价的。 ES5中: global.a = 1; console.log(a); // 1 a = 2; console.log(global.a); // 2 ES6 为了...
  • 6.ES6全局对象属性

    2017-11-19 18:20:04
     全局对象是最顶层的对象,在浏览器环境指的是window对象,在Node.js指的是global对象。在javascript语言中,所有全局变量都是全局对象的属性。(Node的情况比较特殊,这一条只对repl环境适用,模块环境必须显示...
  • window对象是浏览器顶级对象,它具有双重角色 它是JS访问浏览器窗口一个接口 它是一个全局对象,定义在全局作用域中变量函数,函数都会变成window 对象的属性和方法。在调用时候可以省略window,前面学习...
  • ①不属于其他对象的属性和方法,最终都是他的属性和方法(如isNAN(),isFinite(),parseInt(),parseFloat()实际上都是他方法,他的属性 大致有undefined,Nan,Indefinity,Object,Array,Booleab,String,Dat...
  • "top.location.href"是最外层页面跳转 ...location是window对象的属性,而所有网页下对象都是属于window作用域链中(这是顶级作用域),所以使用时是可以省略window。而top是指向顶级窗口对象,pa
  • "top.location.href"是最外层页面跳转...location是window对象的属性,而所有网页下对象都是属于window作用域链中(这是顶级作用域),所以使用时是可以省略window。而top是指向顶级窗口对象,parent是指...
  • 实际上是window对象的属性。这个对象独特之处是唯一一个既属于BOM又属于DOM对象。从BOM角度看,document对象由一系列集合构成,这些集合可以访问文档各个部分 BOM是浏览器对象模型,用来获取或设...
  • js中的window

    2017-02-28 17:47:18
    BOM就是浏览器窗口对象模型...Window对象共有七个属性: defauleStatus:指定窗口状态栏中信息。 status:指定当前窗口状态栏中信息。 frames:是一个数组,其中内容是窗口中所有框架。 parent:指当前窗

空空如也

空空如也

1 2 3 4 5 ... 11
收藏数 210
精华内容 84
关键字:

属于window对象属性的是