第七周

第七周

這一周主要學(xué)習(xí)運(yùn)用js做網(wǎng)頁特效

第一天:

1. 節(jié)點(diǎn)?厕九,網(wǎng)頁是有很多的節(jié)點(diǎn)組成的? 。

元素節(jié)點(diǎn) ? 指的是 :? 標(biāo)簽 ? ? li? span ? ? 俊鱼,節(jié)點(diǎn)類型是1

文本節(jié)點(diǎn)并闲,2? ? ? 屬性節(jié)點(diǎn) ? 帝火,3

注釋,8文檔购公,9

父子兄弟節(jié)點(diǎn):parentNodenextSibling

孩子? ? childNodes? ? ? ? nodeType == 1? 來判斷 是否是 元素節(jié)點(diǎn)

children只得到元素節(jié)點(diǎn)

獲取節(jié)點(diǎn)屬性? ? getAttribute(“title”)

設(shè)置節(jié)點(diǎn)屬性? ? setAttribute (“class”,”one”)

刪除節(jié)點(diǎn)屬性? ? removeAttribute(“title”);

2.?日期函數(shù) ? Date();

聲明:? var? date = new Date();

使用:? 獲取日期和時(shí)間

getDate()? ? ? ? ? ? ? ? ? 獲取日 1-31

getDay ()? ? ? ? ? ? ? ? ? 獲取星期 0-6

getMonth ()? ? ? ? ? ? ? ? 獲取月? 0-11

getFullYear () ? ? ? ? ? ? 獲取完整年份(瀏覽器都支持)

getHours () ? ? ? ? ? ? ? 獲取小時(shí) 0-23

getMinutes () ? ? ? ? ? ? ? 獲取分鐘 0-59

getSeconds () ? ? ? ? ? ? ? 獲取秒? 0-59

getMilliseconds ()? ? ? ? ? ? 獲取當(dāng)前的毫秒

getTime () ? ? ? 返回累計(jì)毫秒數(shù)(從1970/1/1午夜)

3. 定時(shí)器

定時(shí)器? 不需要人工操作 ? 按照一定的時(shí)間進(jìn)行某種動作靠瞎。

setInterval(“函數(shù)”,間隔時(shí)間 ) ? 每隔 n秒去執(zhí)行一次函數(shù)?求妹,有周期性。

setTimeout在執(zhí)行一次代碼之后父能,延遲一段時(shí)間再執(zhí)行何吝,沒有周期性。

4.案例

時(shí)鐘瓣喊,倒計(jì)時(shí)黔酥,分時(shí)提醒,日歷

第二天

1. ? 按鈕不可用? ? disabled =? “disabled”? ||? true棵帽;

2.setInterval(“函數(shù)”,間隔時(shí)間 ) ? 每隔 n秒去執(zhí)行一次函數(shù)?岖寞,有周期性柜蜈。

setTimeout在執(zhí)行一次代碼之后,延遲一段時(shí)間再執(zhí)行隶垮,沒有周期性秘噪。

3.遞歸調(diào)用 :? 函數(shù)自己調(diào)用自己? 函數(shù)遞歸調(diào)用 ? arguments.callee? ? 返回的是? 正在執(zhí)行的函數(shù) 本身

4. 邏輯運(yùn)算符 ? 與? &&? 或? || ? 非? ! ? ? ? ? ! > && > ||

a&&b,如果a為假蹋偏,則返回a,如果a為真則返回b威始。

a||b像街,如果a為真則返回a,如果a為假則返回b镰绎。

5.轉(zhuǎn)換為 字符型

var num = 12345;

num+ “”

String(num);

num.toString(); ? 10進(jìn)制

num.toString(2) ? 二進(jìn)制

6.根據(jù)字符位置返回字符

charAt(索引號)獲取相應(yīng)位置的字符

charCodeAt獲取相應(yīng)位置的字符

第三天

1.offset家族

offset ? 自己的 偏移

offsetWidth? ? 得到自己的寬度

offsetHeight

構(gòu)成 : ? width? + ? padding? +? border

div? ? width 200 ? border 3px? ? padding-right: 15px

div? offsetWidth =? ? 200 +? 6? +? 15? =? 221

div.offsetLeft

得到距離 這個(gè) div 最近的 帶有定位的 父 盒子 ? 左邊距離

offsetParent? ? ? 返回自己的父親元素 ? (帶有定位的)

parentNode? ? 這個(gè)返回親父親 不管父親是否帶有定位

style.top ? offsetTop ?的區(qū)別

offsetTop ? 只讀? ? 只可以得到結(jié)果 但是不能賦值

style.top? ? 能得到 (行內(nèi)式 )? ? 但是可以給值

style.top ? 得到的是? 25px

offsetTop ? 得到的是 25

2.event對象畴栖,事件對象

3.鼠標(biāo)事件

onmouseover? ? ? onmouseout ? onclick

onmousemove當(dāng)鼠標(biāo)移動的時(shí)候? ? 就是說吗讶,鼠標(biāo)移動一像素就會執(zhí)行的事件

div.onmousemove = function() { 語句 }

當(dāng)鼠標(biāo)再div 身上移動的時(shí)候,就會執(zhí)行扛门。

補(bǔ)充網(wǎng)址編碼的認(rèn)識。

4.緩動公式星立,通俗理解就是一個(gè)過渡過程绰垂。

5.重點(diǎn)案例

小米手機(jī)和輪播圖

第四天

1.HTML基本訪問方法window-documentdocument.titledocument.headdocument.bodydocument.documentElement(約等于document.html)

2. scrollTop被卷去的頭部劲装,隱藏在屏幕上方的距離

scrollLeft左邊劃出區(qū)的部分

scrollTo(x,y)去往頁面的x和y坐標(biāo)的位置window.scrollTo(x,y)

4.JSONjs對象表示法數(shù)據(jù)傳輸

JSON指的是JavaScript對象表示法(JavaScriptObjectNotation)

JSON是輕量級的文本數(shù)據(jù)交換格式

JSON獨(dú)立于語言*

JSON具有自我描述性占业,更易理解

var json = {}對象var arr = [] ;數(shù)組varnum;變量

var json = { width: “100px” ,height: 100 }

第五天

1.3個(gè)window事件

重新加載事件unload纯赎,屏幕滾動事件on scroll犬金,窗口改變事件onrpsize

window.onscroll = fucntion() {? fun (); }

fun()? ? function() {iffss }

2.簡單冒泡機(jī)制

事件冒泡: 當(dāng)一個(gè)元素上的事件被觸發(fā)的時(shí)候晚顷,比如說鼠標(biāo)點(diǎn)擊了一個(gè)按鈕,同樣的事件將會在那個(gè)元素的所有祖先元素中被觸發(fā)瞳氓。這一過程被稱為事件冒泡权均;這個(gè)事件從原始元素開始一直冒泡到DOM樹的最上層叽赊。

順序

E 6.0:

div -> body -> html -> document

其他瀏覽器:

div -> body -> html -> document -> window不是所有的事件都能冒泡必指。以下事件不冒泡:blur恕洲、focus、load户辞、unload

3.獲取用戶選擇的內(nèi)容

4.動畫原理癞谒,封裝動畫函數(shù)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末双仍,一起剝皮案震驚了整個(gè)濱河市朱沃,隨后出現(xiàn)的幾起案子茅诱,更是在濱河造成了極大的恐慌,老刑警劉巖敬察,帶你破解...
    沈念sama閱讀 221,635評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件莲祸,死亡現(xiàn)場離奇詭異锐帜,居然都是意外死亡缴阎,警方通過查閱死者的電腦和手機(jī)蛮拔,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,543評論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來痹升,“玉大人建炫,你說我怎么就攤上這事√鄱辏” “怎么了肛跌?”我有些...
    開封第一講書人閱讀 168,083評論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我衍慎,道長转唉,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,640評論 1 296
  • 正文 為了忘掉前任稳捆,我火速辦了婚禮赠法,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘砖织。我一直安慰自己,他們只是感情好茂蚓,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,640評論 6 397
  • 文/花漫 我一把揭開白布牍白。 她就那樣靜靜地躺著切省,像睡著了一般般渡。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上蝴乔,一...
    開封第一講書人閱讀 52,262評論 1 308
  • 那天铝穷,我揣著相機(jī)與錄音,去河邊找鬼。 笑死榆苞,一個(gè)胖子當(dāng)著我的面吹牛碧信,可吹牛的內(nèi)容都是我干的躏筏。 我是一名探鬼主播,決...
    沈念sama閱讀 40,833評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼婶博,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了挠轴?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,736評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體付秕,經(jīng)...
    沈念sama閱讀 46,280評論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,369評論 3 340
  • 正文 我和宋清朗相戀三年毛好,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,503評論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡酒请,死狀恐怖布朦,靈堂內(nèi)的尸體忽然破棺而出右遭,到底是詐尸還是另有隱情亭敢,我是刑警寧澤远剩,帶...
    沈念sama閱讀 36,185評論 5 350
  • 正文 年R本政府宣布锥余,位于F島的核電站驱犹,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏足画。R本人自食惡果不足惜医舆,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,870評論 3 333
  • 文/蒙蒙 一里烦、第九天 我趴在偏房一處隱蔽的房頂上張望废封。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,340評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至潘靖,卻和暖如春穿剖,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背卦溢。 一陣腳步聲響...
    開封第一講書人閱讀 33,460評論 1 272
  • 我被黑心中介騙來泰國打工糊余, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人单寂。 一個(gè)月前我還...
    沈念sama閱讀 48,909評論 3 376
  • 正文 我出身青樓贬芥,卻偏偏與公主長得像,于是被迫代替她去往敵國和親宣决。 傳聞我的和親對象是個(gè)殘疾皇子蘸劈,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,512評論 2 359

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

  • 請參看我github中的wiki,不定期更新尊沸。https://github.com/ivonzhang/Front...
    zhangivon閱讀 7,133評論 2 19
  • 我是一條狗威沫,我的名字叫阿呆贤惯,“媽媽”給我取的名字,因?yàn)樗谝淮我娢业臅r(shí)候棒掠,她覺得我很呆孵构,趴在那里一動也不動⊙毯埽可是氯哮,...
    宸墨煙閱讀 953評論 1 5
  • 作者:夏汐蕊?想看其他作品請點(diǎn)擊這里簡書連載風(fēng)云錄回顧上一章:[連載]?我的愛只屬于你(27) 【第二十八章】動一...
    夏汐蕊閱讀 414評論 0 6