1. 程式人生 > >web前端問題總結

web前端問題總結

1、z-index不起作用?

z-index不起作用原因:1、問題標籤沒有 position:absolute屬性。2、問題標籤浮動:float:left  |  fight 。3、問題標籤父級有position:relative。

     解決:1、問題標籤加position:relative  || absolute屬性。 2、清除浮動。3、position:relative改為positionabsolute

http://blog.sina.com.cn/s/blog_93a6a0c30101fshd.html

2、position:fixed在ie下抖動問題?

原始碼:父級:position: fixed ;

  子級:

position: absolute;//只有加這個屬性,z-index才會起作用
z-index: -1;

以上程式碼在除ie外的瀏覽器都沒有異常,在ie下滾動視窗會使父級來回抖動。

原因:z-index:-1引起的,具體原因還沒找到。

解決:z-index:在取值要在0以上。

3、如何獲取自身到父級的左邊距離?

$('div').position().left    //獲取當前標籤相對於父級的左邊距離。

4、獲取文字框的值

text = $("input").val();

5、||  &&的用法:

a : b || {};

||:非。如果b沒有值,則把後邊的{}賦值給a;如果b有值,則把b的值給a。

a : b && {};

&&:且。如果b有值,則把{}賦值給a;如果b沒有值,則a的值為null或undefined。

eg:

if(a>5){
   alert("haha");
}
//可以這樣寫
a>5 && alert("hah");

在js邏輯運算中:0;“”、null、undefined、NaN都會判斷為false。

&&的優先順序要高於||

&&類似於*;||類似於+。

邏輯運算裡!的優先順序最高。

參考網址:

http://jianguang-qq.iteye.com/blog/462449?page=2(講的比較詳細)!

6、一般框架或庫裡都會遇見這種寫法:

if(!!attr){
    //something
}

這裡的!!attr為什麼不直接寫成attr?

!!的作用是把一個其他型別的變數轉成的bool型別。(這種做法更嚴謹)。

7、$.extend的各種用法。

1)、

var aa = $.extend({},src1,src2);
把src1、src2合併到“{}”中,並給aa。
var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"})
得到結果:result={name:"Jerry",age:21,sex:"Boy"}

2)、

如果extend()只有一個引數

$.extend(src)

這是將src合併到jQuery的全域性物件中去。

$.extend({
  hello:function(){alert('hello');}
  });

3)、過載原型。
extend(boolean,dest,src1,src2,src3...)

深度拷貝:

var result=$.extend( true,  {},  
    { name: "John", location: {city: "Boston",county:"USA"} },  
    { last: "Resig", location: {state: "MA",county:"China"} } ); 

得到結果:

result={name:"John",last:"Resig",
        location:{city:"Boston",state:"MA",county:"China"}}

淺拷貝:

var result=$.extend( false, {},  
{ name: "John", location:{city: "Boston",county:"USA"} },  
{ last: "Resig", location: {state: "MA",county:"China"} }  
                    );

得到結果:

 result={name:"John",last:"Resig",location:{state:"MA",county:"China"}}

8、看一些外掛原始碼時,總會看到:this=that

作用:

把當前作用域的this儲存起來,以供將來呼叫。

好處:

比如當前fn1()的this指向當前執行上下文,如果fn1()裡還有fn2(),則這個this則指向fn2()。

所以,要把fn1()的this儲存起來,在fn2()裡就可以呼叫fn1()的東西了。

相關推薦

web前端總結之文字超出顯示省略號

web前端總結之文字超出顯示省略號 當網頁中顯示文字過多時,會出現如下樣式的文字 文字顯示為省略號,當滑鼠移上去時顯示文字。 這就是文字超出顯示省略號。 主要用到了: text-overflow:ellipsis; overflow:hidden; white-space:

web前端總結面試問題<經常遇到的手寫程式碼 - - >(二)

氣泡排序 var arr = [5,8,3,6,9] for(var i=0;i<arr.length;i++){ for(var j=i+1;j<arr.length;j++){ if(arr[i]>arr[j]){ v

Web前端初學總結

我們 自己的 喜歡 效果 switch 幹什麽 感覺 帶來 編碼 ---恢復內容開始--- 學習了一周的C#,這一周學了不少東西,也寫了不少代碼,感覺挺不錯的,總結一下學到的東西。 最基礎的就是變量、數據、運算。這裏面包含了不少的代碼基

web前端兼容性問題總結

oca 邊距 sof 不能 屬性選擇器 gid 屬性。 t對象 jquer 1. HTML對象獲取問題 FireFox:document.getElementById("idName");ie:document.idname或者document.getElementBy

web前端 —— 移動端知識的一些總結

video apt 自己 addclass cto css url document 空間 一.css部分 1.meta標簽 <meta name="viewport" content="width=device-width,initial-scale=1,user

Web前端面試總結

tcs 一個 網站 ack 平時 工程師 htm javascrip itl Base Prepration: 作為一名Web前端開發工程師,應該要有自己的個人作品(如個人網站之類),博客,和所關註的用於學習和分享Web前端技術的社區或貼吧(如github, w3cs

web前端性能優化總結

函數定義 network 繼承 執行 strong bigpipe view pan odin 1em=16px(但不完全是) em會繼承父元素的字體大小。ie 部分瀏覽器不支持em。 rem繼承根元素的字體大小html。 px和rem vue裏面用jq只能在mounte

web前端總結--HTML

出現 密碼 自動 password http -s 擁有 set 下載 web三要素:   瀏覽器:向服務器發起請求,下載服務器中的網頁(HTML),然後執行HTML顯示出內容   服務器:接受瀏覽器的請求,發送相應的頁面到瀏覽器   HTTP協議:瀏覽器與服務器的通訊協議

web前端學習總結--JQuery

jquery選擇器 下一個 check 方便 .com func 遍歷 bind 過濾選擇器 jQuery 什麽是jQuery   jQuery是一個優秀的JavaScript框架,一個輕量級的JS庫。   它封裝了JS、CSS、DOM,提供了一致的、簡潔的API。  

web前端面試總結(2)

10.27 面試總結與分享(清宇網路) 面試問題 自我介紹 nodejs靜態伺服器路由前端使用Nodejs來寫的麼 整個專案實現的思路,都實現了哪些模組 使用nigix代理解決埠問題 對於地圖的使用,有沒有用過地圖自定義的東西 使用vue的時間,

Atitit 面試技術點最小化問題法總結 目錄 1. Web 前端 1 1.1. Jq 常用操作哪些?? 1 1.2. 查詢後如何繫結後端資料到表格 2 1.3. 提交後怎麼接受表單資料 2 2.

Atitit 面試技術點最小化問題法總結     目錄 1. Web 前端 1 1.1. Jq 常用操作哪些?? 1 1.2. 查詢後如何繫結後端資料到表格 2 1.3. 提交後怎麼接受表單資料 2 2. Mvc Springmvc 2 2.1

web前端面試知識點總結

(1)button是行內元素還是塊級元素? 答:它是可變元素,既不屬於行內元素,也不屬於塊級元素。可變元素:根據上下文語境決定該元素為塊級還是內聯(可變元素如:button、iframe、map等)。 (2)行內元素有哪些?塊級元素有哪些?css盒子模型是什麼? 答: 塊級元素:div

小程式開發實踐總結 - WEB前端

從微信釋出小程式以來,各大公司紛紛跟進都想從微信這個流量池裡撈一杯羹。我司也不例外,我們整個前端團隊這半年來基本上都是在開發小程式。前前後後也開發了四五個小程式了。總覺得要留下點什麼,既是記錄那些年我們踩過的坑,也是希望大家別再掉坑。 那些年我們踩過的坑 css樣式不能引用本地圖片資源

web前端中的jsp網頁總結

JSP全稱Java Server Pages,是一種動態網頁開發技術。它使用JSP標籤在HTML網頁中插入Java程式碼。標籤通常以<%開頭以%>結束。 JSP是一種Java servlet,主要用於實現Java web應用程式的使用者介面部分 準確的說,jsp實在

web前端試題總結

一.填空題 1.網頁的字尾名通常為(xxx.html)或(xxx.htm)的頁面. 2.請寫出在網頁中設定表格邊框的厚度的屬性(border),設定表格單元格之間寬度屬性(cellspacing),設定表格資料與單元格線的距離屬性(cellpadding). 3.預定義格式化標籤<

10年web前端架構師總結開發學習路線!附送學習資料!

首先分享一下我的經驗,想做好一件事,必須要花費一些功夫,然後是多學、多思、多練、多交流、多總結,發現自己的問題,然後一定要克服,在狀態不好的情況下,往往要及時調整。新手學習前端的話,一定要想想為什麼要學習它,是出於一種什麼心態,然後定位好自己,多向大牛請教,多教一些沒有自己水平高的人,那樣往往能讓自

web前端課程技術總結Node.js 使用方法及相關方法分析

測試 一個 ejs 強制 req != server 跨域 ade Node.js 使用方法及相關方法分析 首先我們要了解什麽是node.js? 官方解釋是:node.js是一個基於Chrome v8引擎的javascript 運行環境。Node.js使用了一個事件驅動、非

web前端面試知識點總結(1)

(1)button是行內元素還是塊級元素? 答:它是可變元素,既不屬於行內元素,也不屬於塊級元素。可變元素:根據上下文語境決定該元素為塊級還是內聯(可變元素如:button、iframe、map等)。 (2)行內元素有哪些?塊級元素有哪些?css盒子模型是什麼? 答:塊級

2019 web 前端面試總結(內附面經)

這篇文章不適合拿到 BAT 的大佬及自制力特別差的人 本文只是提供複習的思路,以及我自己的一些面經,並沒有具體的題目 基本情況 據說先把 offer 亮出來才能吸引你們看下去。目前一共有五個。分別是順豐,拼多多,遠景智慧,老虎證券和貝殼。其實拿到拼多多以後很

2018最新的web前端開發框架排行總結

如果你是一個前端開發人員,當你在開發新專案時,想必一定被人問過“你用的是什麼框架?”進而開展各種前端技術話題。但是對於初入門的前端小白來說,遇到這樣的問題估計會產生一系列的疑問“前端框架是什麼意思?前端框架有什麼用?前端框架有哪些... ” 簡單來說,前端框架就是已經搭