2019-08-28 事件

  1. 可以通過綁定事件,觸發(fā)元素樣式的變化钮莲。

  2. addEventListener() 方法免钻。
    addEventListener() 方法用于向指定元素添加事件句柄。
    addEventListener() 方法添加的事件句柄不會(huì)覆蓋已存在的事件句柄崔拥。
    添加同一類型的話极舔,會(huì)同時(shí)執(zhí)行,可能后者會(huì)覆蓋前者链瓦,不同類型的事件拆魏,可以任意添加。

  3. 帶參數(shù)的函數(shù)和不帶參數(shù)的慈俯,調(diào)用方式也稍有區(qū)別渤刃。下面是演示待參數(shù)的場(chǎng)景。
    <script>
    var p1 = 5;
    var p2 = 7;
    document.getElementById("myBtn").addEventListener("click", function() {
    myFunction(p1, p2);
    });
    function myFunction(a, b) {
    var result = a * b;
    document.getElementById("demo").innerHTML = result;
    }
    </script>

  4. 事件的冒泡與捕獲:這個(gè)問題的存在原因在于肥卡,頁(yè)面元素存在嵌套關(guān)系時(shí)溪掀,點(diǎn)擊子元素,也會(huì)觸發(fā)父元素的事件步鉴。那哪個(gè)先觸發(fā)呢揪胃?冒泡就是內(nèi)層子元素先觸發(fā),捕獲就是外層元素先觸發(fā)氛琢。(如果只點(diǎn)擊外層元素是不存在這個(gè)問題的喊递。)采用哪種方式取決于addEventListener()函數(shù)的第三個(gè)參數(shù)。

  5. 創(chuàng)建新的 HTML 元素 (節(jié)點(diǎn)) - appendChild()

6.也可以刪除節(jié)點(diǎn)阳似,刪除時(shí)骚勘,先找到父節(jié)點(diǎn),然后找到子節(jié)點(diǎn),最后對(duì)子節(jié)點(diǎn)進(jìn)行刪除俏讹。
<div id="div1">
<p id="p1">這是一個(gè)段落当宴。</p>
<p id="p2">這是另外一個(gè)段落。</p>
</div>

<script>
var parent = document.getElementById("div1");
var child = document.getElementById("p1");
parent.removeChild(child);
</script>

對(duì)于節(jié)點(diǎn)泽疆,也存在替換操作户矢。

  1. HTMLCollection 與 NodeList 的區(qū)別

(元素是標(biāo)簽,節(jié)點(diǎn)則不僅包含標(biāo)簽殉疼,還有屬性梯浪,文本等內(nèi)容,所以對(duì)同一個(gè)HTML文檔瓢娜,后者比前者的長(zhǎng)度通常要大一些挂洛。)
HTMLCollection 是 HTML 元素的集合。

NodeList 是一個(gè)文檔節(jié)點(diǎn)的集合眠砾。

NodeList 與 HTMLCollection 有很多類似的地方虏劲。

NodeList 與 HTMLCollection 都與數(shù)組對(duì)象有點(diǎn)類似,可以使用索引 (0, 1, 2, 3, 4, ...) 來獲取元素荠藤。

NodeList 與 HTMLCollection 都有 length 屬性伙单。

HTMLCollection 元素可以通過 name哈肖,id 或索引來獲取。

NodeList 只能通過索引來獲取淤井。

只有 NodeList 對(duì)象有包含屬性節(jié)點(diǎn)和文本節(jié)點(diǎn)。

  1. 對(duì)象的構(gòu)造函數(shù)游两。給對(duì)象添加屬性的時(shí)候,可以通過構(gòu)造函數(shù)添加贱案,也可以通過prototype屬性添加止吐,屬性或函數(shù)。
    有時(shí)候我們想要在對(duì)象的構(gòu)造函數(shù)中添加屬性或方法瘩燥。

使用 prototype 屬性就可以給對(duì)象的構(gòu)造函數(shù)添加新的屬性:

實(shí)例

function Person(first, last, age, eyecolor) { this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eyecolor; } Person.prototype.nationality = "English";

嘗試一下 ?

當(dāng)然我們也可以使用 prototype 屬性就可以給對(duì)象的構(gòu)造函數(shù)添加新的方法:

實(shí)例

function Person(first, last, age, eyecolor) { this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eyecolor; } Person.prototype.name = function() { return this.firstName + " " + this.lastName; };

  1. 定時(shí)器和匿名函數(shù)的調(diào)用厉膀。以及調(diào)用函數(shù)代碼時(shí)的賦值。

  2. 日期的格式化實(shí)例服鹅。
    alert(new Date().format("yyyy年MM月dd日"));
    alert(new Date().format("MM/dd/yyyy"));
    alert(new Date().format("yyyyMMdd"));
    alert(new Date().format("yyyy-MM-dd hh:mm:ss"));

var now = new Date();
var nowStr = now.format("yyyy-MM-dd hh:mm:ss");
document.getElementById("demo2").innerHTML=new Date().format("yyyy年MM月dd日");
var nowStr = now.format("yyyy-MM-dd hh:mm:ss");
document.getElementById("demo3").innerHTML=new Date().format("yyyy年MM月dd日hh小時(shí)mm分ss秒");

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末菱魔,一起剝皮案震驚了整個(gè)濱河市吟孙,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌杰妓,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,084評(píng)論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件桩卵,死亡現(xiàn)場(chǎng)離奇詭異雏节,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)钩乍,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,623評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門寥粹,熙熙樓的掌柜王于貴愁眉苦臉地迎上來埃元,“玉大人,你說我怎么就攤上這事岛杀。” “怎么了糊肠?”我有些...
    開封第一講書人閱讀 163,450評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵罪针,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我泪酱,道長(zhǎng),這世上最難降的妖魔是什么毡惜? 我笑而不...
    開封第一講書人閱讀 58,322評(píng)論 1 293
  • 正文 為了忘掉前任斯撮,我火速辦了婚禮,結(jié)果婚禮上帕膜,老公的妹妹穿的比我還像新娘溢十。我一直安慰自己,他們只是感情好张弛,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,370評(píng)論 6 390
  • 文/花漫 我一把揭開白布吞鸭。 她就那樣靜靜地躺著,像睡著了一般刻剥。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上盯滚,一...
    開封第一講書人閱讀 51,274評(píng)論 1 300
  • 那天魄藕,我揣著相機(jī)與錄音,去河邊找鬼背率。 笑死嫩与,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的划滋。 我是一名探鬼主播,決...
    沈念sama閱讀 40,126評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼根资,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了玄帕?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,980評(píng)論 0 275
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤委刘,失蹤者是張志新(化名)和其女友劉穎鹰椒,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體罩抗,經(jīng)...
    沈念sama閱讀 45,414評(píng)論 1 313
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡灿椅,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,599評(píng)論 3 334
  • 正文 我和宋清朗相戀三年茫蛹,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了烁挟。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,773評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡柬采,死狀恐怖且警,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情斑芜,我是刑警寧澤,帶...
    沈念sama閱讀 35,470評(píng)論 5 344
  • 正文 年R本政府宣布盈包,位于F島的核電站醇王,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏寓娩。R本人自食惡果不足惜滥朱,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,080評(píng)論 3 327
  • 文/蒙蒙 一徙邻、第九天 我趴在偏房一處隱蔽的房頂上張望畸裳。 院中可真熱鬧,春花似錦怖糊、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,713評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至劝评,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間蒋畜,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,852評(píng)論 1 269
  • 我被黑心中介騙來泰國(guó)打工插龄, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留科展,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 47,865評(píng)論 2 370
  • 正文 我出身青樓膨处,卻偏偏與公主長(zhǎng)得像砂竖,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子乎澄,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,689評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容