十道前端面試題(5)

  1. 行內元素和塊級元素有哪些,img屬於什麼元素
  2. 寫一下DOM節點的增刪改
  3. 講講304
  4. 如何讓一個元素消失
  5. 事件監聽
  6. 數組常用的方法有哪些
  7. 遍歷數組處理用for循環還有什麼方法嗎
  8. 給你一個亂序數組,你怎麼樣排序
  9. 介紹一下盒子模型
  10. 講講JS的語言特性

1.行內元素和塊級元素有哪些,img屬於什麼元素

行內元素又叫內聯元素,有:

  1. <a>標籤可定義錨
  2. <abbr>表示一個縮寫形式
  3. <acronym>定義只取首字母縮寫
  4. <b>字體加粗
  5. <bdo>可覆蓋默認的文本方向
  6. <big>大號字體加粗
  7. <br>換行
  8. <cite>引用進行定義
  9. <code>定義計算機代碼文本
  10. <dfn>定義一個定義項目
  11. <em>定義爲強調的內容
  12. <i>斜體文本效果
  13. <img>向網頁中嵌入一幅圖像
  14. <input>輸入框
  15. <kbd>定義鍵盤文本
  16. <label>標籤 爲<input>元素定義標註(標記)
  17. <q>定義短的引用
  18. <samp>定義樣本文本
  19. <select>創建單選或多選菜單
  20. <small>呈現小號字體效果
  21. <span>組合文檔中的行內元素
  22. <strong>語氣更強的強調的內容
  23. <sub>定義下標文本
  24. <sup>定義上標文本
  25. <textarea>多行的文本輸入控件
  26. <tt>打字機或者等寬的文本效果
  27. <var>定義變量

塊級元素有:

  1. <address>定義地址
  2. <caption>定義表格標題
  3. <dd>定義列表中定義條目
  4. <div>定義文檔中的分區或節
  5. <dl>定義列表
  6. <dt>定義列表中的項目
  7. <fieldset>定義一個框架集
  8. <form>創建 HTML表單
  9. <h1>定義最大的標題
  10. <h2>定義副標題
  11. <h3>定義標題
  12. <h4>定義標題
  13. <h5>定義標題
  14. <h6>定義最小的標題
  15. <hr>創建一條水平線
  16. <legend>元素爲<fieldset>元素定義標題
  17. <li>標籤定義列表項目
  18. <noframes>爲那些不支持框架的瀏覽器顯示文本,於 frameset元素內部
  19. <noscript>定義在腳本未被執行時的替代內容
  20. <ol>定義有序列表
  21. <ul>定義無序列表
  22. <p>標籤定義段落
  23. <pre>定義預格式化的文本
  24. <table>標籤定義HTML表格
  25. <tbody>標籤表格主體(正文)
  26. <td>表格中的標準單元格
  27. <tfoot>定義表格的頁腳(腳註或表注)
  28. <th>定義表頭單元格
  29. <thead>標籤定義表格的表頭
  30. <tr>定義表格中的行

點擊查看行內元素和塊級元素區別>>


2. 寫一下DOM節點的增刪改

  1. 查找
    DOM1:getElementById(),getElementsByTagName()
    DOM擴展:querySelector()(返回第一個匹配的元素),querySelectorAll()(返回全部匹配的元素)
    HTML5:getElementsByClassName()
  2. 插入
    appendChild():末尾插入
    insertBefore():特定位置插入
  3. 替換
    replaceChild():接受兩個參數,第一個爲要插入的節點,第二個爲要替換的節點
  4. 刪除
    removeChild()
  5. 創建
    createElement()

3. 講講304

304狀態碼是告訴瀏覽器可以從緩存中獲取所請求的資源。

當瀏覽器請求某一文件時,發現自己緩存的文件有Last-Modified,就會在httpRequest裏面添加消息頭If-Modified-Since和If-Non-Match,服務器在收到reqeust時,和服務器本地文件對比,如果沒有更新,則僅僅返回一個響應頭Head(狀態碼304,而沒有響應體),客戶端在收到這個響應時,就會從本地緩存加載請求的資源。

點擊瞭解更多HTTP狀態碼>>


4. 如何讓一個元素消失

隱藏元素的幾種方法:

  1. 該元素樣式設置:display:none;
  2. 該元素樣式設置:visibility:hidden;
  3. 該元素樣式設置高寬爲0
  4. 隱藏其祖先元素
  5. 該元素樣式設置:opacity:0;

5. 事件監聽

  1. 傳統事件綁定
  • 在事件名稱前加on如:onclickonload
  • 兼容性好
  • 同一個元素綁定多個事件時只有最後一個會被觸發
  1. addEventListener()
  • 語法element.addEventListener(type, function, useCapture)第三個參數指定事件是否在捕獲階段執行,默認false(冒泡階段執行),true(捕獲階段執行)
  • 可以給同一個元素綁定多個事件,且不會覆蓋。先綁定的事件先執行
  • IE低版本不兼容
  • removeEventListener()方法移除綁定事件
  1. attachEvent()
  • 語法:element.attachEvent('on+type',function)
  • IE的方法,不遵循W3C標準
  • 後綁定,先執行

6. 數組常用的方法有哪些(點擊查看)>>


7. 遍歷數組處理用for循環還有什麼方法嗎

遍歷數組的方法:

  1. for循環
  2. for...of循環
  3. forEach()
  4. map()
  5. filter()
  6. every()
  7. some()
  8. reduce()
  9. reduceRight()
  10. find()
  11. findIndex()
  12. keys()values()entries()

點擊查看更多數組方法>>


8. 給你一個亂序數組,你怎麼樣排序

排序的方法:

  1. 冒泡排序
  2. 選擇排序
  3. 快速排序
  4. 插入排序
  5. 歸併排序
  6. 希爾排序
  7. 堆排序

數組排序:除了上訴算法排序還可以使用sort()方法

點擊查看常見排序算法實現>>


9. 介紹一下盒子模型(點擊查看)>>


10. 講講JS的語言特性

  1. 腳本語言。JavaScript是一種解釋型的腳本語言,C、C++等語言先編譯後執行,而JavaScript是在程序的運行過程中逐行進行解釋。
  2. 基於對象。JavaScript是一種基於對象的腳本語言,它不僅可以創建對象,也能使用現有的對象。
  3. 簡單。JavaScript語言中採用的是弱類型的變量類型,對使用的數據類型未做出嚴格的要求,是基於Java基本語句和控制的腳本語言,其設計簡單緊湊。
  4. 動態性。JavaScript是一種採用事件驅動的腳本語言,它不需要經過Web服務器就可以對用戶的輸入做出響應。在訪問一個網頁時,鼠標在網頁中進行鼠標點擊或上下移、窗口移動等操作JavaScript都可直接對這些事件給出相應的響應。
  5. 跨平臺性。JavaScript腳本語言不依賴於操作系統,僅需要瀏覽器的支持。因此一個JavaScript腳本在編寫後可以帶到任意機器上使用,前提上機器上的瀏覽器支 持JavaScript腳本語言,目前JavaScript已被大多數的瀏覽器所支持。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章