一、html/css 1. 什么是盒子模型？ ? ? padding+border+width/height 2. float 浮動 （1）浮動的特性 ? ? ? ? 脫離文檔流 ? ? ? ? 行內變成塊 ?? ? ? ? ? 能設置寬高 ? ? ? ? 同級元素有浮動，必須全部都浮動 ? ? ? ? 寬度默認變窄，窄到內容的寬度 ? ? ? ? 浮動后到一行 ? ? ? ? 文本環繞 （2）清除浮動? ? ? ? ? ? clear:both; clearfix clear:after{display:block; content:''; clear:both;} clear{zoom:1;} overflow:hidden; 3. position 定位 （1）相對定位——relative 不脫離文檔流、相對自身定位、行內不變塊 （2）絕對定位——absolute 行內可以變成塊、脫離文檔流、相對于有定位的父級，如果沒有找body、寬度默認變窄，窄到內容的寬度 （3）固定定位——absolute? ? ?? ? ? ? ? ? ? 脫離文檔流、相對于可視區定位、不兼容ie6、行內元素變塊、寬度默認變窄,窄到內容的寬度 二、基礎知識 1. JS是做什么的???------寫效果 做交互 操作樣式 2. alert(456) 帶確定按鈕的彈出框 -------主要用于調試程序 3. 遇到程序不對，第一件事---->F12 ---- chromeF12->右下角,如果有紅點:有錯 4. 引號： ? ? (1) 數字 0-9 不用加引號 ? ? (2) 字母+中文 字符串 需要加引號 (變量除外) ? ? (3) 對于JS來說:單引或雙引都可以 ? ? ? ? ? ? 外面用雙引,里面用單引 ? ? ? ? ? ? 外面用單引,里面用雙引 5. JS所有普通事件都是小寫?onclick ? ? onclick/onmouseover/onmouseout 6. 等號 ? ?= 賦值 ? ? ? ? == 等于 ? ?a=4; 是將4這個值賦值給a 7. 所有標簽都可以給事件 ，都可以加ID，都可以被操作? ? ? 所有樣式都可以操作 8.?遇到復合樣式，將橫杠去掉,后面首字母大寫 ? ? font-size -> fontSize ? ? ? ? ? ? ? padding-right ->paddingRight 9. 函數：可重復調用的代碼塊 ? ? 無論在什么情況什么地方 函數名() 就是調用函數 10. 在JS里.長得像的都可以合并 11. 變量——存儲數據的容器 ? ? (1)一定要?var開頭，第二次不用加var，可以直接用，如果第二次賦值，會將上一個值覆蓋 ? ? (2)對大小寫敏感?a A 不是一個變量 ? ? (3)以字母和下劃線開頭 ? ? (4)變量（看不到值）不需要加引號，字符串 字面量 需要帶引號 var 變量名=變量值; var 變量名='abc'; var 變量名=12; var 變量名=document.getElementById(''); var a=b=c=4; 只有a有var var a=4，b=5; 都有var? ? ? (5)局部變量只能在定義它的函數里使用 ??? (6)全局變量： JS自動放到前面 不知道具體是什么值，先給一個undefined 定義函數可以放到調用函數后面，JS會自動將所有的函數放到最前面定義 -->全局函數 ? ? (7)變量沒有預解析. 12.?class 易于維護，用style或class都可以 ------原則：不能混用 13.?xxx.style.xx?賦值在行間 讀的時候也讀的行間，行間層級最高 三、事件：用戶操作 ***兼容性：document.getElementById(' ') ---低版本火狐不兼容 ***元素屬性操作：obj.style(……) 四、編寫js的流程 ?1.布局：HTML+CSS ?2.屬性：確定要修改哪些屬性 ?3.事件：確定用戶用哪些操作 ?4.js編寫：在實踐中，用js來修改頁面元素的樣式 五、參數 （1）參數：聲明時，在括號里多了一點東西。參數名是自定義的，相當于建了一個局部變量 var n=…… （2）function 函數名（參數）{語句} ? ? ? ? ? 函數名（參數值） （3）調用的時候給的參數值 （4）當值可以變動的時候 （5）參數可以有多個值。 function 函數名（參數1，參數2，…）{語句} 函數名（參數1，參數2，…）； 六、函數 ?1.函數定義：function 函數名(){ 代碼; } ?2.函數調用：函數名(); 只聲明，啥都不做；只調用，會報錯。函數在哪兒定義不重要，重要的是在哪兒調用。 ? ? 例一： ? ? var a=15;--------------------15 ? ? function show(){-------------不執行 ? ? ? ? alert(a); ? ? } ? ? var a=5;---------------------5 ? ? show();----------------------調用，此時a=5 例二：? ?? ? ? var n=4; ? ? var n2=55; ? ? var a1=function(){ ? //定義函數 ? ? //alert(abc); ? //沒有提過一個變量叫abc，所以報錯? ? ??}?? ? ? ? function a(b1,b2,b3){ ? ? ? ? alert(b3); ? ?//傳幾個都可以，可以不用 ?? ? ? }? ? ? a(n,5,'abc'); 例三： ? ? var a1=function(){ ? ? ? ? alert(123); ? ? } ? ? alert(a1); ? ? function a(f){ ? ? ? ? //相當于 f=a1 ? ?把a1傳進去，用f接收，相當于給a1又取了一個名字叫f ? ? ? ? f(); ? ? } ? ? a(a1); 4. 傳參變顏色 ? ? function setColor(c){ ? ? ? ? var oBox=document.getElementById('box'); ? ? ? ? oBox.style.background=c; ? ? } ? ? <input type="button" value="變紅" ? οnclick="setColor('red')"> 5. 恢復樣式 ? ? function fn(a,b){ ? ? ? ? var oBox=document.getElementById('box'); ? ? ? ? if(a=='tt'){ ? ? ? ? ? ? oBox.style.width='400px'; ? ? ? ? ? ? oBox.style.height='400px'; ? ? ? ? ? ? oBox.style.background='red'; ? ? ? ? ? ? oBox.style.display='block'; ? ? ? ? }else{ ? ? ? ? ? ? oBox.style[a]=b; ? ? ? ? } ? ? } ? ? <input type="button" value="變寬" οnclick="fn('width','600px')" /> ? ? <input type="button" value="恢復" οnclick="fn('tt')" /> 七、網頁換膚 ?1.任何標簽都可以加ID，包括link、html ?2.任何標簽的任何屬性都可以修改 ?3.html里怎么寫，js里就怎么寫(className和復合樣式例外) 兼容性問題：objtxt.title='……' 火狐不支持 八、if判斷 ?1.例子： #box{display:none;} if(oBox.style.display=='none'){ ? ? ? oBox.style.display='block'; ? //讀取行間樣式，第一次點的時候沒有行間樣式所以為空，第一次判斷不成立，所以要點擊兩次。所以應該把第一次要做得事情放在else里。 }else{ ? ? oBox.style.display='none'; } 2. else部分可以省略 九、擴展 ?1.為a鏈接加js ? ? ? ? <a href="javascript:;"></a> ?2.className問題 ? ? ? 原本自帶的屬性可以直接操作 。只有一個例外class，是Js的關鍵字（保留字），所以在js中要寫成className 十、瀏覽器執行順序 加載-----> ?解析 -----> 執行 《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的JS一起学01：css复习、js基础知识、事件、参数、函数、网页换肤、if判断、className问题、浏览器执行顺序的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。