生活随笔
收集整理的這篇文章主要介紹了
前端面试题(五)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1、absolute生成絕對定位的元素,相對于值不為 static的第一個父元素進行定位。
2、fixed (老IE不支持)生成絕對定位的元素,相對于瀏覽器窗口進行定位。
3、relative生成相對定位的元素,相對于其正常位置進行定位。
4、static默認值。沒有定位,元素出現在正常的流中。
5、inherit規定從父元素繼承 position 屬性的值。
6、sticky粘性定位,該定位基于用戶滾動的位置。它的行為就像 position:relative; 而當頁面滾動超出目標區域時,它的表現就像 position:fixed;,它會固定在目標位置。 在Javascript中this總是指向調用它所在方法的對象。因為this是在函數運行時,自動生成的一個內部對象,只能在函數內部使用。
1
、對于全局的方法調用,this指向的是全局對象window,即調用方法所在的對象。
2
、通過對象定義的函數的this指向該實例化對象
3
、構造函數內部定義的函數中,this指向該構造函數:
4、箭頭函數中this的指向與外層函數的this指向一致:
HTTP報文就是瀏覽器和服務器間通信時發送及響應的數據塊。
瀏覽器向服務器請求數據,發送請求(request)報文;服務器向瀏覽器返回數據,返回響應(response)報文。
報文信息主要分為兩部分
1.包含屬性的首部(header)--------------------------
附加信息(cookie,緩存信息等)與緩存相關的規則信息,均包含在header中
2.包含數據的主體部分(body)-----------------------HTTP請求真正想要傳輸的部分
- http緩存機制有哪些?緩存機制的執行過程是什么?
HTTP緩存有多種規則,根據是否需要重新向服務器發起請求來分類,將其分為兩大類(強制緩存,對比緩存(協商緩存))
對于強制緩存,服務器通知瀏覽器一個緩存時間,在緩存時間內,下次請求,直接用緩存,不在時間內,執行比較緩存策略。
對于比較緩存,將緩存信息中的Etag和Last-Modified通過請求發送給服務器,由服務器校驗,返回304狀態碼時,瀏覽器直接使用緩存。
瀏覽器第一次緩存:
瀏覽器再次請求:
方法一:
div {
position:
absolute;
/* 相對定位或絕對定位均可 */width:
500px;
height:
300px;
top:
50%;
left:
50%;
transform:
translate(-50%, -50%);
background-color:
pink;
/* 方便看效果 */}
方法二:
div {
position:
relative;
/* 相對定位或絕對定位均可 */width:
500px;
height:
300px;
top:
50%;
left:
50%;
margin:
-150px 0 0 -250px;
/* 外邊距為自身寬高的一半 */background-color:
pink;
/* 方便看效果 */}
方法三:
.container {
display:
flex;
align-items:
center;
/* 垂直居中 */justify-content:
center;
/* 水平居中 */}
.container div {
width:
100px;
height:
100px;
background-color:
pink;
/* 方便看效果 */}
1、server通過HTTP Response中的"Set-Cookie: header"
把cookie發送給client
2
、client把cookie通過HTTP Request 中的“Cookie: header”發送給server
3、每次HTTP請求,Cookie都會被發送。
function Public() {this.handlers =
{};
}
Public.prototype =
{// 訂閱事件on:
function(eventType, handler){var self =
this;if(!(eventType
in self.handlers)) {self.handlers[eventType] =
[];}self.handlers[eventType].push(handler);return this;},// 觸發事件(發布事件)emit:
function(eventType){var self =
this;var handlerArgs = Array.prototype.slice.call(arguments,1
);for(
var i = 0; i < self.handlers[eventType].length; i++
) {self.handlers[eventType][i].apply(self,handlerArgs);}return self;},// 刪除訂閱事件off:
function(eventType, handler){var currentEvent =
this.handlers[eventType];var len = 0
;if (currentEvent) {len =
currentEvent.length;for (
var i = len - 1; i >= 0; i--
){if (currentEvent[i] ===
handler){currentEvent.splice(i, 1
);}}}return this;}
};var Publisher =
new Public();//訂閱事件a
Publisher.on('a',
function(data){console.log(1 +
data);
});
Publisher.on('a',
function(data){console.log(2 +
data);
});//觸發事件a
Publisher.emit('a', '我是第1次調用的參數'
);Publisher.emit('a', '我是第2次調用的參數');
- Ajax 是什么? 如何創建一個Ajax?(ajax的執行流程)
ajax:異步傳輸+js+
xml。所謂異步,在這里簡單地解釋就是:向服務器發送請求的時候,我們不必等待結果,而是可以同時做其他的事情,等到有了結果它自己會根據設定進行后續操作,與此同時,頁面是不會發生整頁刷新的,提高了用戶體驗。(1
)創建XMLHttpRequest對象,也就是創建一個異步調用對象(2
)創建一個新的HTTP請求,并指定該HTTP請求的方法、URL及驗證信息(3
)設置響應HTTP請求狀態變化的函數(4
)發送HTTP請求(5
)獲取異步調用返回的數據(6)使用JavaScript和DOM實現局部刷新
?
轉載于:https://www.cnblogs.com/strong-FE/p/10940538.html
總結
以上是生活随笔為你收集整理的前端面试题(五)的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。