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>

        瀏覽器各個(gè)屬性的作用

        共 1028字,需瀏覽 3分鐘

         ·

        2021-12-17 10:03

        作為前端程序員不可避免的會(huì)和瀏覽器打交道,所以要對(duì)瀏覽器的各個(gè)屬性的作用進(jìn)行了解,方便開發(fā)及調(diào)試,這里以谷歌瀏覽器為例進(jìn)行簡(jiǎn)單的介紹。一是鞏固對(duì)瀏覽器屬性的認(rèn)識(shí),二是方便大家的學(xué)習(xí)。



        1. 首先打開谷歌瀏覽器按F12查看控制臺(tái)屬性。


        2.比較常用的是可以選擇不同的設(shè)備參數(shù),設(shè)備顯示的分辨率大小及顯示的百分比。


        在設(shè)備選擇的底部可以編輯,可以自定義需要的設(shè)備型號(hào)及自定義尺寸分辨率尺寸進(jìn)行保留。


        3.可以進(jìn)行鼠標(biāo)的選中。點(diǎn)擊這個(gè)箭頭可以進(jìn)行代碼及區(qū)域的選中,比較適合調(diào)整一些比較難的細(xì)節(jié)樣式及排查問題。


        4.調(diào)整樣式,定位問題,也可以在style中定位自己的類名直接寫自己想要的樣式,然后復(fù)制到代碼中。


        5.控制臺(tái)可以查看代碼報(bào)錯(cuò),根據(jù)報(bào)錯(cuò)定位問題,也可以在控制臺(tái)輸入一些指令,輸出一些變量及數(shù)組,在代碼中可以使用console.log()進(jìn)行打印輸出。


        6.這個(gè)源文件指的是可以看到自己的源代碼文件,我們可以在這里找到自己的源代碼文件然后雙擊左側(cè)進(jìn)行debugger操作或者在代碼中寫debugger這個(gè)單詞。這個(gè)比較方便定位一些比較難得bug,排查問題,直達(dá)程序運(yùn)行到哪里,有沒有取到值等等,相比與console.log,alert優(yōu)勢(shì)還是很大的,可以配合使用,比較常用的快捷鍵,F(xiàn)8放行,F(xiàn)10下一步,F(xiàn)11進(jìn)入某個(gè)方法,最后的那個(gè)可以清除bug的標(biāo)記。


        7.這個(gè)application可以查看一些緩存,比較我代碼中存的session,cookie等,方便下一個(gè)頁面或者流程取值。直接在即將進(jìn)入的頁面提前打開,然后進(jìn)入頁面查看自己存的值和對(duì)象是不是自己想要的。這個(gè)在一些銀行或者大型的內(nèi)網(wǎng)企業(yè)十分常用,因?yàn)樗麄冊(cè)诰W(wǎng)關(guān)這個(gè)層面里面的東西幾乎都是私密的。


        8.這個(gè)network可以查看一些接口信息,比如前后端交互可以查看接口的入?yún)⒑头祷刂?,如果入?yún)⒂?,沒有返回值和正確的響應(yīng)碼都可以把問題拋給后端,可以查看請(qǐng)求及返回時(shí)長(zhǎng),一些性能檢測(cè),前后端的入?yún)⒑头祷刂怠⒄?qǐng)求頭、響應(yīng)體、響應(yīng)碼等都可以在這里查哦


        9.后面的這幾個(gè)不一一介紹了,用的不是很多,有興趣的可以研究一下。


        好啦,時(shí)候不早了,還得改bug,本期內(nèi)容就分享到這里,我們下期見!


        瀏覽 70
        點(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>
            精品码产区一区二视频 | 爱搞搞就要爱搞搞 | 少妇饥渴偷公乱13章深夜书屋 | 成人无码免费福利视频 | 天天干天天橾 | 艳妇臀荡h乳欲伦交换漫画 | 91麻豆精品国产自产 | 影音先锋日韩无码 | 强行扒开双腿猛烈进入在视频 | 日韩午夜精品人妻无码一区二区 |