国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

前端應(yīng)該知道的基本知識(shí)

2bdenny / 1160人閱讀

摘要：所有我們不熟悉或者沒有掌握的知識(shí)皆可稱之為知識(shí)盲區(qū)，有知識(shí)盲區(qū)并不可怕，針對知識(shí)盲區(qū)去學(xué)習(xí)即可。只有這樣，我們才會(huì)準(zhǔn)確知道自己的知識(shí)盲區(qū)所處何處，以及發(fā)現(xiàn)更多的知識(shí)盲區(qū)。節(jié)點(diǎn)對應(yīng)的對象是，其他的具體節(jié)點(diǎn)對象全都是繼承自對象。

前端時(shí)間在部門內(nèi)進(jìn)行分享，準(zhǔn)備素材時(shí)偶然發(fā)現(xiàn)下面的一個(gè)現(xiàn)象，因?yàn)楹彤?dāng)時(shí)分享的主題無關(guān)，就先記下來了，事后重新審視，并把一些思考記錄如下：

一、問題

HTML：




    
    DOM-插入子節(jié)點(diǎn)



第0個(gè)標(biāo)題

結(jié)果：

渲染后的HTML結(jié)構(gòu)

為什么？？？

二、原因

寫法1中

var text = document.createTextNode("第1個(gè)標(biāo)題");

text是Text類型，而appendChild()方法的返回值類型取決于入?yún)⒌念愋?/strong>，即傳入什么類型的參數(shù)，此函數(shù)的執(zhí)行結(jié)果就是什么類型，下面代碼執(zhí)行后

h1.appendChild(text);

返回值的仍然是Text類型，因?yàn)閠ext是Text類型，所以寫法2的鏈?zhǔn)綄懛ǎㄒ膊恢喇?dāng)時(shí)為啥想來這么一招）

document.getElementById("app").appendChild(document.createElement("h1").appendChild(document.createTextNode("第2個(gè)標(biāo)題")));

相當(dāng)于

document.getElementById("app").appendChild(new Text("第2個(gè)標(biāo)題"));

所以第2個(gè)標(biāo)題是文本節(jié)點(diǎn)，而不是h1元素。

三、引申

最初發(fā)現(xiàn)此問題，百思不解，又苦于谷歌時(shí)不知道如何描述，后來在一個(gè)學(xué)習(xí)群中得到了解答，不過也被鄙視了一下下。

痛定思痛，反思自己為什會(huì)在這個(gè)問題上迷失，最終得出的結(jié)論：對于底層DOM的api不熟。

在我開始接觸前端時(shí)，jQuery和各種前端框架早已大行其道，它們將繁瑣的底層DOM操作封裝的盡善盡美，讓我們在開發(fā)的時(shí)候爽到飛。當(dāng)然也讓我們對DOM底層也生疏起來，甚至對于有些半路出家的前端而言根本不是生疏，因?yàn)閺膩頉]有熟悉過。這是一種非常危險(xiǎn)的現(xiàn)象。試想，現(xiàn)在如果讓我們拋棄所有庫和框架去實(shí)現(xiàn)一個(gè)組件，我們是否能夠依然游刃有余呢？我是沒有信心的。

所有我們不熟悉或者沒有掌握的知識(shí)皆可稱之為"知識(shí)盲區(qū)"，有知識(shí)盲區(qū)并不可怕，針對知識(shí)盲區(qū)去學(xué)習(xí)即可。

我感覺對自己職業(yè)的技能要求有一個(gè)全面的認(rèn)識(shí)，有一個(gè)俯視視角才是最重要的。只有這樣，我們才會(huì)準(zhǔn)確知道自己的知識(shí)盲區(qū)所處何處，以及發(fā)現(xiàn)更多的知識(shí)盲區(qū)。

以下是我結(jié)合本次內(nèi)容，對前端技能樹的一個(gè)梳理：

1.前端技能樹

其中我始終堅(jiān)信JavaScript才是前端人員的核心競爭力，它決定了一個(gè)前端人員在前端領(lǐng)域能走多遠(yuǎn)和能達(dá)到的高度。

JavaScript是一門編程語言，與之緊密相關(guān)的三個(gè)領(lǐng)域：BOM、DOM、ECMAScript。

BOM（Browser Object Model，瀏覽器對象模型），將瀏覽器抽象成對象，進(jìn)而可以操作瀏覽器。

DOM（Document Object Model，文檔對象模型），將網(wǎng)頁抽象成對象，進(jìn)而可以操作網(wǎng)頁。

ECMAScript（European Computer Manufacturers Association，歐洲計(jì)算機(jī)制造商協(xié)會(huì)），JavaScript的標(biāo)準(zhǔn)，JavaScript是它的實(shí)現(xiàn)。我們對JavaScript語法的學(xué)習(xí)其實(shí)就是對此標(biāo)準(zhǔn)的學(xué)習(xí)，比如我們整天說的ES6。

2.BOM

BOM提供了獨(dú)立于內(nèi)容而與瀏覽器窗口進(jìn)行交互的對象，由于BOM主要用于管理窗口與窗口之間的通訊，因此其核心對象是window。

BOM由一系列相關(guān)的對象構(gòu)成，并且每個(gè)對象都提供了很多方法與屬性，這些對象的實(shí)例又都存在于window對象中。我們平時(shí)最常用到的包括location、history、document，navigtor和screen很少用，了解即可。

JavaScript語法的標(biāo)準(zhǔn)化組織是ECMA，DOM的標(biāo)準(zhǔn)化組織是W3C，BOM缺乏標(biāo)準(zhǔn)，它最初是Netscape瀏覽器標(biāo)準(zhǔn)的一部分。

3.DOM

在DOM中，所有事物都是節(jié)點(diǎn)。DOM將HTML文檔表達(dá)為樹結(jié)構(gòu)，DOM是被視為HTML的節(jié)點(diǎn)樹。

節(jié)點(diǎn)對應(yīng)的對象是Node，其他的具體節(jié)點(diǎn)對象全都是繼承自Node對象。

DOM 定義了訪問和操作HTML文檔的標(biāo)準(zhǔn)方法。換言之，DOM 是關(guān)于如何獲取、修改、添加或刪除 HTML 元素的標(biāo)準(zhǔn)。

以下為不同類型節(jié)點(diǎn)對象提供的常用屬性和方法：

（1）Node

屬性

atrributes

childNodes

firstChild

lastChild

nextSibling

previousSibiling

nodeType

nodeName

方法

appendChild()

insertBefore()

（2）Document

屬性

body

方法

創(chuàng)建

createElement()

createAttribute()

createTextNode()

createComment()

遍歷

getElementById()

getElementByTagName()

getElementByClassName()

（3）Element

方法

遍歷

getElementByTagName()

getElementByClassName()

操作

getAttribute()

setAttribute()

（4）Attr

屬性

name

value

（5）Text

4.JavaScript與Node.js的關(guān)系

（1）JavaScript是一門編程語言，Node.js是JavaScript的運(yùn)行環(huán)境

（2）JavaScript目前主要有兩種運(yùn)行環(huán)境：

客戶端：瀏覽器

服務(wù)器端：Node.js

（3）任何一種運(yùn)行環(huán)境都要有解釋JavaScript的能力，此能力由JavaScript引擎提供，最著名的當(dāng)屬V8引擎，Chrome瀏覽器和Node.js都是集成了V8引擎

（4）目前常見框架與兩者的關(guān)系：

Angular、React、Vue是用JavaScript寫的前端框架，編譯后可以直接在瀏覽器中運(yùn)行

Express、Koa是用JavaScript寫的服務(wù)器端框架，可以直接在Node.js中運(yùn)行

Webpack、Gulp、Grunt等是運(yùn)行在Node.js中的構(gòu)建框架

所以，如果以后再有人問你：用Node.js寫過什么東西？直接鄙視他！

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/108527.html

相關(guān)文章

  • 前端應(yīng)該知道的GraphQL

    摘要：什么是先貼官網(wǎng)英文中文。所有的操作必須指明到最底層的，并且返回值為標(biāo)量，以確保響應(yīng)結(jié)果的結(jié)構(gòu)明白無誤。對于前端來說，在查詢的時(shí)候基本都要了解上面說的這幾個(gè)概念，具體應(yīng)用可參見我的這篇文章如何利用開發(fā)個(gè)人博客。 本文主要結(jié)合GitHub GraphQL API，從前端使用者的角度來談GraphQL，沒有GraphQL項(xiàng)目的同學(xué)可以拿GitHub GraphQL API練手，具體代碼可參見...

    lansheng228 評(píng)論0 收藏0

  • 2017前端現(xiàn)狀--答題救不了前端新人

    摘要：眾所周知，前端近幾年鬧了一場革命。這些問題反應(yīng)了什么現(xiàn)象確實(shí)前端很火，引來了一批批新人。前端小白們?nèi)缁鹑巛钡膶W(xué)習(xí)著現(xiàn)在前端流行的新技術(shù)棧。寫在最后所以啊，在目睹了很多白癡問題后，我終于發(fā)出了一聲吶喊，答題救不了前端新人。 眾所周知，前端近幾年鬧了一場革命。前端在編程領(lǐng)域也掀起了學(xué)習(xí)潮。至少在中國，從2013年下半年至今，在搜索指數(shù)上，有著爆炸式的增長。可以看下數(shù)據(jù)：百度指數(shù)，Googl...

    jone5679 評(píng)論0 收藏0

  • 2017前端現(xiàn)狀--答題救不了前端新人

    摘要：眾所周知，前端近幾年鬧了一場革命。這些問題反應(yīng)了什么現(xiàn)象確實(shí)前端很火，引來了一批批新人。前端小白們?nèi)缁鹑巛钡膶W(xué)習(xí)著現(xiàn)在前端流行的新技術(shù)棧。寫在最后所以啊，在目睹了很多白癡問題后，我終于發(fā)出了一聲吶喊，答題救不了前端新人。 眾所周知，前端近幾年鬧了一場革命。前端在編程領(lǐng)域也掀起了學(xué)習(xí)潮。至少在中國，從2013年下半年至今，在搜索指數(shù)上，有著爆炸式的增長。可以看下數(shù)據(jù)：百度指數(shù)，Googl...

    alogy 評(píng)論0 收藏0

  • 2018.11.19秋招末第二波前端實(shí)習(xí)/校招小結(jié)

    摘要：背景個(gè)人背景就讀于東北某普通二本院校計(jì)算機(jī)軟件工程專業(yè)，現(xiàn)大四，北京實(shí)習(xí)前端方向，自學(xué)，技術(shù)棧時(shí)間背景大概是在月日準(zhǔn)備好簡歷開始投遞秋招差不多已經(jīng)結(jié)束招聘崗位不多，投遞對象為大一些的互聯(lián)網(wǎng)公司事件背景第一個(gè)入職的是好未來的前端實(shí)習(xí)崗，待遇工 背景 個(gè)人背景 就讀于東北某普通二本院校計(jì)算機(jī)軟件工程專業(yè)，現(xiàn)大四，北京實(shí)習(xí) 前端方向，自學(xué)，vue技術(shù)棧 時(shí)間背景 大概是在11月9日準(zhǔn)備...

    suxier 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<