YY前端筆試總結

1.一個元素float之後。爲何要清除浮動?清除浮動的方法有哪些?html

浮動確實是經常用,也知道清除浮動的必要性。但要我道個因此然,仍是得絞盡腦汁。我我的的理解是,當一個元素float之後,就脫離正常的文檔流,高度塌陷,也就是浮動元素原來的佔位空間就消失了。那麼緊跟着的元素的寬度就會佔領浮動元素的位置,好像浮動元素不存在似的。那麼疑問就來了。假設緊跟着的元素沒有不論什麼的清除浮動行爲,但是感受好像認的浮動元素同樣,給他讓出空間。請看:node

<span style="font-size:18px;"><div style="float:left;with:100px;height:100px;background:yellow;">float content</div>
<div class="normal" style="background:red;height:800px;">normal content</div></span>
效果:

事實上,通過求證.normal元素並無認得float元素。他的寬度事實上有延伸到float那邊,僅僅是float元素覆蓋在他的上面,即z-index比較高,不信,你看一下效果(.class{margin-left:-10px;}):bootstrap


只是。.normal元素的text文本倒像是認得float元素同樣,這個不知道該怎麼解釋。或許是w3c的規定吧?因此大概瞭解float的工做原理之後。咱們就知道該怎樣去清除浮動了。跨域

(1)父級的元素中清除浮動:利用定高來清除浮動,只是這種方法的惟一肯定是父級的元素中必須是定高佈局。瀏覽器

(2)借用僞元素來清除浮動,在父級的元素中上使用。.normal:after{content:"";clear:both;display:inline-block||block;} .normal{_zoom:1//觸發haslayout}安全

(3)最方便也最常用的是在緊跟的浮動元素後面用clear:both;app

(4)導航欄浮動之後ul元素上經常會用overflow:hidden來清除浮動;框架

(5)bootstrap經常用的是加入空白元素<div class="clearfix"></div>  .clearfix{clear:both;}dom

以上就是我能想到的清除浮動的方法。函數

2.Javascript跨域訪問問題

在實際項目中沒有機會去領略Javascript跨域訪問問題,但卻是據說過。Javascript出於安全考慮以及同源策略的限制。不一樣意跨域調用其它頁面的對象。但是程序猿是萬能的。總想破不能爲萬能,所以就有了跨域訪問的技術。這樣不久下降代碼的開發而且還實現代碼共享。何樂而不爲呢?so,趕忙去補及一下有關的實現技術。

參考: JavaScript跨域總結與解決的方法,認真研讀之後,對跨域有了進一步的瞭解,但願儘快用得上這偉大的技術。

跨域技術分不一樣的場合不一樣的方法:

(1)主域一樣但是子域不一樣一時候,採取document.domain+iframe的設置:

域名一:http://www.a.com/a.html  域名二:http://script.a.com/b.html(主域爲a.com,二級域爲a.com前面的。ps:順便弄清一下主域和二級甚至多級域的概念,好比:baidu.com是主域。那麼*.baidu.com都是二級域。。。不懂繼續度娘去)

在www.a.com域名下的a.html下設置代碼:

document.domain=a.com;

var iframe=document.createElement("iframe");

iframe.src="http://script.a.com/b.html";

iframe.style.display="none";

document.body.appendChild("iframe");

window.onload=function(){

     var doc=iframe.documentContent||iframe.contentWindow.document;

    alert(doc.document.getElementsByTagName('h1')[0].lastChild.nodeValue);

}

另外在script.a.com的b.html上也要加上document.domain=a.com;假設二者之間沒有不論什麼掛鉤以及約定的話。那後果不堪設想。

這種方法簡單是簡單,但也會帶來一些問題。試想。假設script.a.html受到攻擊或是安全上的問題,那同主域的其它域名也會引發安全上的漏洞。另外一個方面是假設頁面中引入過多的iframe框架的話,頁面會很是難控制。

(2)這種方法是最熟悉的,動態建立script標籤,而後再用回調函數去處理。

動態建立script以及相關操做就不用詳說了,有趣的是推斷節點是否載入完成。不是用window.onload而是js.onload

js.onload=js.onreadystatuschange=function(){

    if(!this.readyState||this.readyStatu==='loaded'||this.readyState==='complete'){

        //callback函數在此

       js.onload=is.onreadystatechange=null;

    }

}

還有其它的方法,在剛剛的博客上也用具體的解說。眼下仍是無法理解。慢慢的去琢磨,去運用。

3.reflow是什麼?

reflow是迴流的意思。做用在瀏覽器渲染頁面時對元素的構建,理解是理解了。但仍是不能很是好的道出個因此然。因此查了很是多資料,認爲別人寫的不錯。因此轉載了一下,地址:怎樣下降瀏覽器reflow。方便之後看。

4.other other

其它的相對而言仍是比較簡單的,考的都是基礎,基礎較紮實細心的話通常都沒有問題--期待走得更遠更高。come on!

相關文章
相關標籤/搜索