1. fiddler怎麼定位前端bug還是後端bug
1.發現bug之後，重現bug的時候使用fiddler抓包去分析
2.如果前端提交的數據在fiddler中顯示有誤，那麼就是前端的bug
3.如果在前端提交的數據在fiddler中顯示無誤，那麼就是後台的bug
4.除了fiddler等抓包工具外，還可以通過後台的日誌去判斷
2. 前端框架如何實現定位
前端bug主要分為3個類別：HTML,CSS,Javascript三類問題
給個最大的區別方式方法：
出現樣式的問題基本都是CSS的bug
出現文本的問題基本都是html的bug
出現交互類的問題基本都是Javascript的bug
區分前後台交互：查看網路請求
TMS對應的VM模板，出現的一些截斷控制，轉換功能都屬於前端的問題
標簽閉合—表象，頁面中出現大范圍的混亂，就是少了標簽的情況，導致標簽未閉合
標簽浮出—例如滑鼠移動到文本位置，浮出全名的這種浮出形式都屬於標簽浮出的問題
標簽在不同的瀏覽器的一種解析方式的不同導致的前端bug例如如下結構
頁面定點的問題：最明顯的前端功能，在於點擊某個鏈接將頁面位置定位到對應的位置
頁面的跳轉，也屬於html的問題，大家在出現點擊未跳轉或者跳轉方式不正確的問題，直接可以定位到跳轉屬性的問題，找到對應的跳轉對應的塊提供給開發人員即可
兼容型bug
腳本兼容型問題：在出現對應交互的問題就基本可以定位到腳本兼容型bug，例如DIV的顯示和層結構。實際可以參考聚劃算的幾個商品滑鼠移動到小圖的時候，對應大圖展示的功能。
頁面樣式兼容型問題：直接表象在樣式上，都是基於框架的頁面展示錯誤，很容易定位
業務性bug
內容型bug
有產生交互類的問題，大多數都可以定位到是屬於javascript產生的問題，該部分大多不會報錯
有錯誤提示類的。頁面左下方有出現javascript的錯誤提示；有彈出錯誤信息提示的bug；瀏覽器返回的一些錯誤彈出框都屬於javascript的bug
現在以淘寶的前端人員工作為例進行相關bug定位的剖析
判斷前後台問題的區分方法：
FF, 打開錯誤控制台
a) Html中如果有鏈接，有相應的情況下，基本可以定位到是屬於前端的問題
b) 如果為空，或者有出現error錯誤信息，我們就可以定位到屬於後台開發的問題
一、HTML
最常見的HTML的問題—就是標簽的問題了，最常見的排查和解決辦法就是查看頁面源代碼，然後通過檢查標簽的工具，現在暫時提供idea.exe進行檢查，有其他更好的工具再進行推薦。
常見問題類別：
該部分可以看做為一個大的框即是標簽<a> 內嵌標題的標簽<p>，裡面再有這些個內容<ing>,那麼在不同的瀏覽器中，可能ie和FF的解析會產生不同，假設IE解析 為<a><p><ing></ing></a></p>的一種形式，但在FF 下可能解析為
<a><ing></ing></a>
<p></p>
的兩行的形式從而導致前端在復古鞋/板鞋這塊ing裡面的格式產生混亂
結構可看為：
a) 我們可以通過右鍵，查看元素的工具進行定位到毛點所定位到的位置，如果出現問題這種問題很直觀，並且能通過這種方法直接定位到問題
二、CSS，產生樣式問題。例如：排版，布局，顏色，背景等
css的bug主要分為：兼容型bug 、業務性bug 和 內容型bug
a) 表現：僅在少數幾個瀏覽器上出現
b) 原因：瀏覽器的解析不一致
c) 解決：根據實際情況進行前端代碼的通用性
d) 類別：
a) 表現：在所有瀏覽器下都有該問題
b) 原因：對業務不熟悉
c) 解決：根據需求進行修改達到業務要求
該類型的定位，主要在和實現的要求不一致，最直接表現在頁面的友好型，用戶的可用性的bug，可以定位為該類型
a) 表現： 前端自測正確，但在填入內容後，出現的錯誤，內容消失等
b) 原因： 擴展性未考慮周全
c) 解決： 進行overflow test
輸入內容的長度限制等功能可定位為內容型bug
三、Javascript
最直接的判斷方法，刷新頁面，出現滯後顯示的一些模塊基本都為腳本的輸出塊。該部分的一些問題可以參照兼容型bug中類別的腳本兼容型bug。
3. 怎麼判斷是前端bug還是後端bug
在提bug時，只有明確定位是前端bug還是後端bug，才能正確指派給對應的開發同學，如果經常分不清楚，一直需要開發同學重新指派，不僅浪費了時間，還會被開發同學吐槽，今天就帶大家解鎖一些區分前後端bug的技能，分分鍾get~
1、出現樣式的問題基本都是CSS的bug
2、出現文本的問題基本都是html的bug
3、出現交互類的問題基本都是JS的bug
1、未發送請求，就屬於前端bug
2、介面請求url錯誤，傳參錯誤，就屬於前端bug
3、介面返回數據錯誤，就屬於後端bug
1、例如頁面載入慢或提交表單慢，一直pending，抓包查看請求耗時，如果耗時長，那就屬於後端bug
1、越權。可以分為水平越權和垂直越權，以下兩個例子都屬於後端Bug。
水平越權的例子：在業務系統中，本來用戶A只能對自己的個人信息進行增刪改查，但是通過抓包，修改用戶id（一般用戶id都是遞增的），可以獲取到其他人的個人信息，或者賬號A將自己的個人信息頁面通過瀏覽器發送給用戶B，用戶B登錄系統後可以看到用戶A的信息，這就是水平越權了
垂直越權的例子：在業務系統中，本來用戶A對某條記錄只有查看的許可權，但是通過抓包，可以對記錄進行修改，這就是垂直越權了
1、例如對於欄位有效性的校驗等，前後端均需要校驗，因此屬於前後端共同的bug
以上內容僅供參考，請大家提出優化意見或建議~
4. web前端當絕對定位在相對定位裡面時，絕對定位可以
1.定位的專業解釋
(1)語法
position:static|absolute|fixed|relative
(2)說明
從上面語法可以看出，定位的方法有很多種，它們分別是靜態(static)，絕對定位(absolute)，固定(fixed)，相對定位(relative)。在這個教程里，我不逐一講，只講最常用也是最實用的兩個定位方法：絕對定位(absolute)、相對定位(relative)。
絕對定位(absolute)：將被賦予此定位方法的對象從文檔流中拖出，使用left，right，top，bottom等屬性相對於其最接近的一個最有定位設置的父級對象進行絕對定位，如果對象的父級沒有設置定位屬性，即還是遵循HTML定位規則的，則依據body對象左上角作為參考進行定位。絕對定位對象可層疊，層疊順序可通過z-index屬性控制，z-index值為無單位的整數，大的在最上面，可以有負值(目前負值FF不支持)。
相對定位(relative)：對象不可層疊，依據left，right，top，bottom等屬性在正常文檔流中偏移自身位置。同樣可以用z-index分層設計。
2.定位的形象解釋
我先來架設一個虛擬的場景：有一個矩形的房間，裡面還有一個水桶裝了些水，水裡還浸泡著一個西瓜，這個房間半空中還有不少的鉤子用於掛東西用。現在我把網頁元素與上面物件對應上，那麼房間就是一個網頁，水桶是網頁中的一個板塊，桶中的水就是文本流，西瓜就是將要被定位的對象。
(1)貢獻的絕對定位(absolute)
對照前面解釋，如果西瓜被賦予絕對定位，那麼就等於把西瓜從水中撈起來掛在半空中的鉤子上，水桶中西瓜原來佔用的空間水會自動填補它(絕對定位對象會讓出自己原先佔用位置，所以說它是貢獻的)。此時如果之前沒有對水桶進行定位設定，那麼被拿起的西瓜位置不會再受水桶位置影響，水桶怎麼移動，西瓜還是掛在原來位置，至於西瓜要怎放，則以房間左上角(body左上角)為准，用left，right，top，bottom值來定位。
但是如果水桶也給出了定位設置(通常是相對定位，下面有講到這一實用技巧)，此時西瓜的擺放就沒有那麼自由了，盡管此時西瓜被拿起來了不會影響水桶中的水(文本流)，但它還是要聽桶的話，桶會告訴西瓜「你可以活動，但應該在我的范圍內走動，比方說我要你在我左上方1米處，你就要跟死這一點，我走你也要跟著走」，如果桶中有很多個西瓜，可以全部拿出來吊到半空中，它們將被安排在不同高度的空間(層)，所以在房頂垂直往下看，有可能看到不同西瓜層疊在一起的情況(這個所謂的高度在網頁中是不存在的，就像FLASH動畫中的不同層上安排了元素，但它們在看時不會有深度感覺)。可見絕對定位的對象參考目標是它的父級，專業稱之為包含塊。
(2)自私的相對定位(relative)
相對定位一個最大特點是：自己通過定位跑開了還佔用著原來的位置，不會讓給他周圍的諸如文本流之類的對象。相對定位也比較獨立，做什麼事它自己說了算，要定位的時候，它是以自己本身所在位置偏移的(相對對象本身偏移)。再拿前邊作比如來解，那麼此時西瓜似乎是有魔法的，如果西瓜通過相對定位在水桶中偏移了你會看到一個現實生活中不存在的現象：水中有一個地方水凹下去了，周圍的水不能填補它，西瓜看起來在旁邊，如果攪動一下桶中的水，那個凹的位置會發現改變(文本流對相對定位對象還存在影響)，但是凹處到西瓜出現的距離始終保持一致。可見文本流與它之間還會互相影響，因為對象並沒有真正脫離文本流，就像有兩個人在同一層樓水平移動的過程中會有碰頭的機會。
(3)總結兩種定位的特徵
絕對定位就像是把不同對象安排到了一棟高樓的不同樓層(一般指不是第一層，我們這里理解為文本流就放在首層)，它們互不影響，但是它們怎麼移動與你樓的地基和面積(父級)有關。相對定位指對象還是在首層樓與文本流一起存放，它們之間肯定存在影響。
(4)對特殊情況的補充
在用相對定位和絕對定位的時候，有一種情況是它們的定位值用到了負值則對象可沿相反方向移動，剛才說到的把對象安排在一棟樓的不同層，如果某個對象一開始就是背靠著最外邊牆的，此時再用一個負值定位它，它就會神奇般地跑出牆外去了，當然現實中可沒有這種驚險而又神奇的事發生
5. 測試：進入某個頁面顯示內容錯誤，如何定位是前端還是後端問題
朋友您好，進入某個頁面顯示內容錯誤，定位是前端問題還是後端問題，其實很簡答。將後端的日誌等級調低，當頁面顯示內容錯誤的時候，可以看一下後端日誌有沒有報錯；其次，如果你是研發人員的話，可以debug或者將頁面請求的響應值都列印出來。還有一種方法，就是在頁面端，使用一些工具，如打開開發者工具，點擊網路，可以看一下請求後台的返回值是否是預期的，如果是預期的值，頁面展示不對，那就是前端展示出現了問題，如果是後端響應的值都不對，那可以從後端排查問題。
6. 我是web前端程序員，經常遇到火狐下的定位問題，特別是在table表格的時候，具體情況如圖。
您好！感謝您對火狐產品的支持！如果您的電腦上面有多款瀏覽器，當您打開火狐瀏覽器，界面上就會有個提示，是否設置為默認瀏覽器，點擊「是」就可以了。火狐瀏覽器使用的是Gecko內核，是一款開源、安全的瀏覽器，擁有非常強大的擴展功能，可以根據自己的需求定製瀏覽體驗。您可以在火狐社區了解更多內容。希望我的回答對您有所幫助和得到您的採納。
7. 前端定位的幾種方式
前端技術的發展是互聯網自身發展變化的一個縮影。
前端技術指通過瀏覽器到用戶端計算機的統稱，存貯於伺服器端的統稱為後端技術。
前端開發主要職能就是把網站的界面更好地呈現給用戶。
以前會Photoshop和Dreamweaver就可以製作網頁，隨著網站開發難度加大、開發方式多樣，網頁製作更接近傳統的網站後台開發，網頁製作更多被稱為Web前端開發。前端技術包括4個部分：前端美工、瀏覽器兼容、CSS、HTML「傳統」技術與Adobe AIR、Google Gears,以及概念性較強的互動式設計，藝術性較強的視覺設計等。
在Web1.0時代，由於網速和終端能力的限制，大部分網站只能呈現簡單的圖文信息，並不能滿足用戶在界面上的需求，對界面技術的要求也不高。隨著硬體的完善、高性能瀏覽器的出現和寬頻的普及，技術可以在用戶體驗方面實現更多種可能，前端技術領域迸發出旺盛的生命力。
2005年以後，互聯網進入Web2.0時代，各種類似桌面軟體的Web應用大量涌現，前端由此發生了翻天覆地的變化。網頁不再只是承載單一的文字和圖片，各種富媒體讓網頁的內容更加生動，網頁上軟體化的交互形式為用戶提供了更好的使用體驗，這些都是基於前端技術實現的。
8. 淺談前端開發的水到底有多深
再次說說目前前端的工作狀態吧。其實我覺得現在的全端慢慢地已經成為了b/s以及c/s中的b還有c，兼顧了兩樣工作。
1,以前對於前端的定位可能只是「頁面仔」，把設計師的設計變成一個實際的網頁。不過現在可不是這么簡單了，同樣是一張設計圖，需要在許多千奇百怪的瀏覽器上面進行兼容，調試。而且因為現在網頁的交互已經變得越來越復雜，單純的網頁已經不能夠滿足於用戶。而更加像是一個富客戶端。
2,而且隨著HTML5跨平台應用的興起，前端的定位又進一步發展了。因為可以要求前端編寫移動端web app應用甚至是跨平台應用。這個時候，前端要學習的東西就更多了。
3,可能這些只是一個表面上看到的東西。因為前端工程師如果定位不好，在一個團隊中很容易成為一個中間人。為什麼這么說呢，因為團隊中會使用一種後端語言，常見的有python,php,ruby現在還有node.js（對不起，我知道node.js不是一種語言，不過你懂就行了），如果你不會這種後端語言，你會變得好像一個局外人，甚至在團隊中顯得像個外包。因此前端又需要在應用層面上會這些後端的語言，比如說要爬爬數據，你總不能在瀏覽器上就完成吧？所以前端的范圍就更廣了。
好吧，從幾個方面說了前端為什麼那麼苦逼。其實前端是一個很好的練武場，你一定會在前端職位上成為一個多面手，學習到最多的東西，因為你跨維度是最大的，你懂設計，懂交互，懂後端語言，懂前端語言，會溝通，會兼容，你都做到了，你已經是個牛人了！歡迎加入前端。
9. 前端定位組件獲取用戶定位失敗，想問問是什麼問題
應該不是這個載入的問題，在我把協議改成http的時候，總是能夠獲取到定位。但是改成https就不行了。。。官網demo也不能改成https調試，所以我估計是https的原因。。。我剛剛試了一下，不載入apis那個，現在顯示
.maps.LatLng is not a constructor
10. web前端工程師怎麼給自己定位
前端對於網站來說，通常是指網站的前台部分，包括網站的表現層和結構層。前台的應用和網頁直接展示給客戶，用戶體驗的重要性決定了後台只是為前台服務的。因此，前端開發的重要性不言而喻。現在的微信、淘寶、網站、手機網站都是通過前端開發來做的。目前並沒有學校開設HTML5課程，但是培訓機構的出現，對於准備進入H5行業的學員來說是無比的好消息。H5EDU的HTML5課程融合了HTML5開發基礎課程、CSS3基礎課程和移動前端交互JavaScript+JQuery+Ajex等課程,從入門到精通,讓開發者全面學習HTML5,快速掌握HTML5開發技能。現在主流的開發中包括頁面模板製作、頁面布局、 頁面特效、頁面美化、 網頁游戲、微網站製作、常見的APP等，都基於前端開發技術完成。