1. <strong id="7actg"></strong>
    2. <table id="7actg"></table>

    3. <address id="7actg"></address>
      <address id="7actg"></address>
      1. <object id="7actg"><tt id="7actg"></tt></object>

        盤點(diǎn)JavaScript中那些進(jìn)階操作知識(shí)(下篇)

        共 4918字,需瀏覽 10分鐘

         ·

        2021-08-31 03:07

        點(diǎn)擊上方“IT共享之家”,進(jìn)行關(guān)注

        回復(fù)“資料”可獲贈(zèng)Python學(xué)習(xí)福利

        仰天大笑出門去,我輩豈是蓬蒿人。

        大家好,我是IT共享者,人稱皮皮。上篇文章給大家分享了盤點(diǎn)JavaScript中那些進(jìn)階操作知識(shí)(上篇),這篇文章繼續(xù)來看看趴!

        前言

        相信做網(wǎng)站對(duì)JavaScript再熟悉不過了,它是一門腳本語言,不同于Python的是,它是一門瀏覽器腳本語言,而Python則是服務(wù)器腳本語言,我們不光要會(huì)Python,還要會(huì)JavaScript,因?yàn)樗鼘?duì)做網(wǎng)頁方面是有很大作用的。

        1.Javascript刷新頁面

        history.go(0) location.reload() location=location location.assign(location) document.execCommand('Refresh') window.navigate(location) location.replace(location) document.URL=location.href


        2.Js瀏覽器兼容問題

        1).瀏覽器事件監(jiān)聽

        function addEventhandler(target,type,fn,cap){            if(target.addEventListener)               /*添加監(jiān)聽事件*/              {                       target.addEventListener(type,fn,cap)                }            else{                 target.attachEvent('on'+type,fn)  /*IE添加監(jiān)聽事件*/               }          }       function removeEventhandler(target,type,fn,cap){            if(target.removeEventListener)            /*刪除監(jiān)聽事件*/             {                target.removeEventListener(type,fn,cap)                }            else{                 target.detachEvent('on'+type,fn)    /*IE刪除監(jiān)聽事件*/               }          }

        2).鼠標(biāo)鍵判斷

        function bu(event){var bt= window.button || event.button;if (bt==2)  {  x=event.clientX  y=event.clientY     alert("您點(diǎn)擊了鼠標(biāo)右鍵!坐標(biāo)為:"+x+','+y)  }else if(bt==0)  {    a=event.screenX    b=event.screenY  alert("您點(diǎn)擊了鼠標(biāo)左鍵!坐標(biāo)為:"+a+','+b)  }else if(bt==1)  {  alert("您點(diǎn)擊了鼠標(biāo)中鍵!");  }}

        3).判斷是否按下某鍵

        function k(event){var ke=event.keyCode || event.whichif(event.shiftKey==1)  {  alert('您點(diǎn)擊了shift');  } alert(ke) alert(event.type)}

        4).網(wǎng)頁內(nèi)容節(jié)點(diǎn)兼容性

        1)).網(wǎng)頁可視區(qū)域?qū)捀?/span>
        var w=document.body.offsetWidth|| document.documentElement.clientWidth|| document.body.clientWidth;var h=document.body.offsetHeight|| document.documentElement.clientHeight || document.body.clientHeight;
        2)).窗體寬度高度 比可視區(qū)域要大
        window.innerHeight - 瀏覽器窗口的內(nèi)高度(以像素計(jì)) window.innerWidth - 瀏覽器窗口的內(nèi)寬度(以像素計(jì))
        3)).頁面滾動(dòng)條距離頂部的距離
        var t=document.documentElement.scrollTop || document.body.scrollTop
        4)).頁面滾動(dòng)條距離左邊的距離
        var s=document.documentElement.scrollLeft || document.body.scrollLeft
        5)).元素到瀏覽器邊緣的距離
          function off(o){   #元素內(nèi)容距離瀏覽器邊框的距離(含邊框)        var l=0,r=0;        while(o){            l+=o.offsetLeft+o.clientLeft;            r+=o.offsetTop+o.clientTop;            o=o.offsetParent;        }        return {left:l,top:r};    }
        6)).獲取滾動(dòng)條高度
        // 滾動(dòng)條的高度function getScrollTop() {var scrollTop = 0;if (document.documentElement && document.documentElement.scrollTop) {        scrollTop = document.documentElement.scrollTop;    }else if (document.body) {        scrollTop = document.body.scrollTop;    }return scrollTop;}
        7)).DOM節(jié)點(diǎn)操作
        function next(o){//獲取下一個(gè)兄弟節(jié)點(diǎn)        if (o.nextElementSibling) {            return o.nextElementSibling;        } else{            return o.nextSibling;        };    }    function pre(o){//獲取上一個(gè)兄弟節(jié)點(diǎn)        if (o.previousElementSibling) {            return o.previousElementSibling;        } else{            return o.previousSibling;        };    }    function first(o){//獲取第一個(gè)子節(jié)點(diǎn)        if (o.firstElementChild) {            return o.firstElementChild;//非IE678支持        } else{            return o.firstChild;//IE678支持        };    }    function last(o){//獲取最后一個(gè)子節(jié)點(diǎn)        if (o.lastElementChild) {            return o.lastElementChild;//非IE678支持        } else{            return o.lastChild;//IE678支持        };    }
        8)).窗口的寬高
        document.body.scrollWidth||document.docuemntElement.scrollWidth;//整個(gè)網(wǎng)頁的寬document.body.scrollHeight||document.docuemntElement.scrollHeight;//整個(gè)網(wǎng)頁的高
        9)).屏幕分辨率的寬高
        window.screen.height;//屏幕分辨率的高window.screen.width;//屏幕分辨率的寬
        10)).坐標(biāo)
        window.screenLeft;//x坐標(biāo)window.screenX;//X坐標(biāo)window.screenTop;//y坐標(biāo)window.screenY;//y坐標(biāo)
        11)).屏幕可用工作區(qū)寬高
        window.screen.availHeight window.screen.availWidth

        5).事件源獲取

        e.target || e.srcElement

        6).行外樣式

        funtion getStyle(obj,name){   if(obj.currentStyle){      //IE    return obj.currentStyle[name];    }else{    //Chrom,FF   return getComputedStyle(obj,false)[name];      } }

        7).阻止事件冒泡函數(shù)封裝

        function pre(event){
        var e = event || window.event;
        if(e.stopPropagation){ // 通用方式阻止冒泡行為
        e.stopPropagation();
        }else{ //IE瀏覽器
        event.cancelBubble = true;
        }

        8).阻止瀏覽器默認(rèn)行為(例如點(diǎn)擊右鍵出來菜單欄)

        function stop(event) {
        var e = event || window.event;
        if (e.preventDefault){
        e.preventDefault(); // 標(biāo)準(zhǔn)瀏覽器
        }else{
        e.returnValue = false; // IE瀏覽器
        }
        }

        3.嚴(yán)格模式

        "use strict"


        4.判斷變量類型

        typeof  variableinstance  instanceof  objectinstance.constructor== objectObject.prototype.toString.call(instance)


        5.下載服務(wù)器端文件

        <a href="http://somehost/somefile.zip" download="myfile.zip">Download file</a>


        總結(jié)

        這篇文章主要介紹了JavaScript的進(jìn)階操作命令!希望對(duì)大家的學(xué)習(xí)有所幫助。

        看完本文有收獲?請(qǐng)轉(zhuǎn)發(fā)分享給更多的人

        IT共享之家

        入群請(qǐng)?jiān)谖⑿藕笈_(tái)回復(fù)【入群】

        ------------------- End -------------------

        往期精彩文章推薦:

        瀏覽 44
        點(diǎn)贊
        評(píng)論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報(bào)
        評(píng)論
        圖片
        表情
        推薦
        點(diǎn)贊
        評(píng)論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報(bào)
        1. <strong id="7actg"></strong>
        2. <table id="7actg"></table>

        3. <address id="7actg"></address>
          <address id="7actg"></address>
          1. <object id="7actg"><tt id="7actg"></tt></object>
            伊人影院大香 | 骚老师影院 | A片在线观看网址 | 日韩无码中文字幕 | 91丝袜呻吟高潮美腿白嫩校花 | 日韩精品免费一区二区三区竹菊 | 国产在线色视频 | 亚洲AV秘 无码一区在线 | 日韩欧美一区二区三区久久婷婷 | 中文字幕一区二区三区三区四区 |