web前端教程《每日一題》(1-99)完結

米女巫發表於2019-02-16

第1期(2016年4月6日):

(1)js中關閉當前視窗的方法是:window.close();

第2期(2016年4月7日):

(1)js中使字串中的字元變為小寫的方法是:toLowerCase方法;

例如:"TEST".toLowerCase();執行結果:"test"。

第3期(2016年4月8日):

(1)在js中,讓瀏覽器彈出確認框的語句是:confirm;

例如:window.confirm("我就是確認框");執行結果是瀏覽器彈出資訊確認框,點選確定,返回true,反之返回false。

第4期(2016年4月11日):

(1)把7.25四捨五入為最接近的整數的方式是:Math.round();

Math.round()執行標準舍入,即它總是將數值四捨五入為最接近的整數。

第5期(2016年4月12日):

(1)在html5中,實現輸入框佔位符的屬性是:placeholder屬性;

它提供可描述輸入欄位預期值的提示資訊,該提示會在輸入欄位為空時顯示,並會在欄位獲得焦點時消失。    

第6期(2016年4月13日):

(1)在css3中,能夠實現背景裁剪的新特性是:background-clip;

background-clip屬性規定背景的繪製區域。它對應的值有3個:border-box(背景被裁剪到邊框盒)、padding-box(背景被裁剪到內邊距框)、content-box(背景被裁剪到內容框)。

第7期(2016年4月14日):

(1)在html5的新特性中,擁有多種繪製路徑、矩形、圓形、字元以及新增影像的方法,結合javaScript實現繪製影像的元素是:canvas;

注意:canvas元素本身是沒有繪圖能力的。所有的繪製工作必須在javaScript內部完成。
    

第8-9期(2016年4月15日):

(1)javaScript語句,var a=10,b=20;alert(“a+b=”+a+b);執行結果是在瀏覽器視窗彈出:a+b=1020;

在js中,字串與數字相加,數字會被強制轉換成字串型別,再進行相加,也就是變成兩個字串的連結,所以結果是字串"a+b="+"10"+"20"="a+b=1020"。

(2)var a=5,b=6;alert(a+b+”10″);執行結果是在瀏覽器視窗彈出:1110。

本題中先進行的是數字5與數字6的相加操作,得到的結果是11,再進行數字11與字串`10`的相加,此時數字11會被轉換成字串`11`,再進行兩個字串的連線,所以結果是1110。

第10-13期(2016年4月16日):

(1)在html5新特性中,用於定義文件頁尾的標籤是:footer。

<footer>標籤定義document的頁尾。

(2)在css3中,實現給元素新增圓角邊框的屬性是:border-radius。

border-radius屬性十分常用,讓過去切圖才能實現圓角邊框,現在只要一句css程式碼即可實現,並且對瀏覽器相容性也很友好。

(3)javaScript由三部分組成,分別是:ECMAScript,BOM和DOM。

文件物件模型(DOM)描述了處理網頁內容的方法和介面。

(4)在jQuery中,實現動畫的函式是:animate()函式。

animate()方法通過css樣式將元素從一個狀態改變為另一個狀態。css屬性值是逐漸改變的,這樣就可以建立動畫效果。

第14-17期(2016年4月18日):

(1)在css中,能夠使文字水平居中的css屬性是:text-align。

text-align屬性,當其值為center的時候,文字內容就會水平居中;它的值還有可能是:left(居左),right(居右),justify(實現兩端對齊文字效果),inherit(繼承父元素的text-align屬性值)。

(2)在html中的a標籤中,實現在新視窗中開啟連結的標籤屬性是:target屬性。

target屬性當它的值為_blank的時候就會實現在新視窗中開啟,它的值還可以是:_self(當前視窗中開啟),_parent(父frame中開啟),_top(整個視窗中開啟)。

(3)var a=999;  a++;  alert(++a);  請問執行後彈出的結果是:1001;

執行a++後的結果是1000,然後執行++a,得到的結果是1001,再執行alert()函式,所以彈出的結果是1001。

(4)var a=888;  ++a;  alert(a++);  執行後彈出的結果是:889。

執行到++a後的結果是889,alert(a++)的時候,先執行彈出,再執行a++,所以彈出的是889,而不是900。

第18-20期(2016年4月19日):

(1)在img標籤中,當影像載入失敗,會用替換文字來顯示相關資訊,那麼,定義替換文字的屬性是:alt。

alt屬性,用來為影像定義一串預備的可替換的文字。替換文字屬性的值是使用者定義的。

(2)在CSS3中,實現文字陰影效果的新屬性是:text-shadow;

我們能夠規定水平陰影、垂直陰影、模糊距離,以及陰影的顏色。

(3)在html標籤中,定義最小的標題的是:<h6>標籤。

<h1> 定義最大的標題。<h6> 定義最小的標題。

第21-23期(2016年4月20日):

(1)用於播放 HTML5 音訊檔案的元素是:<audio>元素。

<audio>元素,還可以通過它的屬性,來控制音訊的自動播放,迴圈播放,暫停等操作。

(2)var a;    alert(a);   執行後彈出的結果是:undefined。

如果變數通過var宣告,但是並未初始化的時候,變數的值為undefined。

(3)在jquery中,想要移除指定的DOM節點元素,使用的方法是:remove()函式。

remove()函式,該方法移除被選元素,包括所有文字和子節點。

第24-27期(2016年4月21日):

(1)在ECMAScript6中,定義一個變數只在所處的程式碼塊起作用的關鍵字是:let。

關鍵字let,ES6 新增了 let 命令,用來宣告變數。它的用法類似於 var,但是所宣告的變數,只在 let 命令所在的程式碼塊內有效。

(2)console.log(typeof null);  執行的結果是在控制檯輸出:object。

輸出object;在javascript中,null值表示一個空物件指標,而這正是使用typeof操作符檢測null值時會返回“object”的原因。

(3)console.log(typeof  “3”);  執行的結果是在控制套輸出:string。

因為"3"就是一個字串String型別。

(4)console.log(typeof +`3`);  執行結果是:number型別。

number 型別用於應該包含數值的輸入域,您還能夠設定對所接受的數字的限定。

第28-30期(2016年4月22日):

(1)在 HTML5 中,哪個元素用於組合標題元素:<hgroup>。

<hgroup>元素,用於對網頁或區段的標題進行組合。

(2)在HTML5中,哪個屬性用於規定輸入欄位是必填的:required。

required屬性規定必需在提交之前填寫輸入欄位。如果使用該屬性,則欄位是必填的。

(3)哪種輸入型別定義滑塊控制元件:range。

range定義帶有 slider 控制元件的數字欄位。

第31-34期(2016年4月25日):

(1)在html5中,實現元素可拖動的標籤屬性是:draggable屬性。

為了使元素可拖動,可以把 draggable 屬性設定為 true。

(2)在html5中,實現本地儲存,且儲存資料不受時間限制的方式是:localStorage儲存。

使用localStorage可以簡單地記錄當前客戶端使用者對網站的訪問次數。

(3)在html5中,用於定義頁面內容之外的內容標籤是:<aside>標籤。

<aside>標籤,定義其所處內容之外的內容,aside 的內容應該與附近的內容相關。比如:可用作文章的側欄。

(4)在html5中,用於描述文件或文件某個部分的細節的新標籤是:<details>標籤。

<details>標籤,不過,目前只有chrome和safari瀏覽器支援此元素。

第35-38期(2016年4月26日):

(1)在CSS3中,可以規定背景圖片的定位區域的屬性是:background-origin。

background-origin屬性,它的值可以是: content-box、padding-box 或 border-box 。

(2)單詞太長的話就超出某個區域,在CSS3中,實現文字強制文字進行換行的屬性是:word-wrap。

word-wrap屬性,當它的值等於break-word的時候,就可以實現文字強制換行,可以對單個單詞進行拆分。

(3)在CSS中,用於定義單詞間距的屬性是:word-spacing。

word-spacing屬性,它可以增加或減少單詞間的空白。

(4)在CSS中,規定文字段落首行的縮排的屬性是:text-indent。

text-indent屬性,如果要實現首行空兩個字元的話,text-indent:2em即可。    

第39-42期(2016年4月27日):

(1)在js中,`1555`+3的執行結果是:`15553`;

字串與數字相加,數字會被轉換成字串,最後變成兩個字串拼接。

(2)在javaScript中,`1205`-3的執行結果是:1202;

字串與數字相減,字串會被轉換成數字再相減,等到的結果是1202.

(3)在js中,if([] instanceof Array){alert(“yes”)}else{alert(“no”)};的執行結果是彈出:yes。

通過字面量方式建立的陣列物件是屬於Array類的一個例項,所以返回true,故彈出“yes”。

(4)在js中,if([] instanceof Object){alert(“hello”)}else{alert(“world”)};的執行結果是彈出:hello。

通過字面量方式建立的陣列物件是屬於Array類的一個例項,所以返回true,故彈出“yes”。

第43-45期(2016年4月28日):

(1)console.log(`hello`+(1<2?)`world`:`me`);執行後的結果是在控制檯輸出:world。

因為+操作符的優先順序高於三元操作符,執行順序分別是:(1<2)得到true,然後`hello`+true=`hellotrue`,最後進行三元操作符,得到`world`。

(2)在html5中,用於定義導航連結的新元素是:nav。

<nav>標籤,它是HTML5中的心標籤。定義導航連結的部分。

(3)在HTML5 Geolocation API,實現獲取使用者位置的方法是:getCurrentPosition()。

注意:鑑於getCurrentPosition()方法的特性可能侵犯使用者的隱私,除非使用者同意,否則使用者位置資訊是不可用的。

第46-48期(2016年4月29日):

(1)在html5中,input元素用於定義數值的輸入與的屬性是:required屬性。

required屬性,屬性規定必須在提交之前填寫輸入欄位。如果使用該屬性,則欄位是必填的。

(2)在html5中,定義選取時間(小時和分鐘)的型別是:time型別。

type="time",現在大部分瀏覽器都支援此屬性值。

(3)在html5中,input元素中定義郵件的輸入域型別的是:email型別。

在提交表單時,會自動驗證 email 域的值。

第49-51期(2016年5月4日):

(1)var a = [33, 2, 123]; console.log(a.sort());執行後輸出的結果是:[123, 2, 33]。

當不帶引數呼叫sort()時,陣列元素以字母表順序排序輸出。

(2)var a = [1, 2, 3]; console.log(a.join());執行後的結果是輸出:1,2,3。

陣列的操作方法join是用來將陣列中所有元素都轉化為字串並連線在一起,返回最後生成的字串的。不指定分隔符,預設的是逗號分隔。所以是:1,2,3。

(3)與上一期稍有不同,var a = [1, 2, 3];console.log(a.join(“-“));執行後輸出的結果是:1-2-3。

與上一題一樣,但是這一題輸出語句指定空格為“-”,所以輸出:1-2-3。

第52-54期(2016年5月5日):

(1)程式碼執行的結果輸出:前端教程。

var str1=str2="web";
(function(){
    var str1=str2="前端教程";
})()
console.log(str2);
雖然str2是匿名函式內部,但是並沒有被var定義,所以會往上一級去尋找,找到並重新賦值成“前端教程”。

(2)程式碼執行的結果輸出:web。

var str1=str2="web";
(function(){
    var str1=str2="前端教程";
})()
console.log(str1);
程式碼中有兩個str1,但是他們的都用var定義,處在不同的作用域,不會被覆蓋,所以輸出的str1是同一個作用域下的str1,所以是:“web”。

(3)程式碼執行的結果輸出:課堂。

var str1=str2="web";
(function(){
    var str1=str2="課堂";
    console.log(str2);
})()
因為str2沒有被var定義,所以找到上一級的作用域下的str2,並把它的值覆蓋了,所以輸出的str2是“課堂”。

第55-56期(2016年5月6日):

(1)程式碼執行的結果輸出:css3。

if(10>9>8==true){
    console.log("html5");
}else{
    console.log("css3");
}
先比較10和9,10 > 9是成立的,此時返回的是true。true和8進行比較運算,此時會出現資料型別的轉換,true會轉換成數字1,再與8進行比較,1自然是小於8的,因此此處返回的是false。最後比較false和true,這兩者自然是不等的,執行else裡面的語句,輸出:css3。

(2)程式碼執行的結果輸出:second。

var obj={};
obj.name="first";
var peo=obj;
peo.name="second";
console.log(obj.name);
關於變數型別,分為了兩大類,一種是引用型別,一種是值型別,值型別相當於是重新建立了一個空間,然後將內容複製了一份放置到了空間當中。引用型別相當於是重新建立了一份地址,兩個地址(obj和peo)都是指向一個儲存空間的,那麼此時修改任意一個都會對另一個造成影響。

第57-59期(2016年5月9日):

(1)在DOM物件中,獲取元素的開始和結束標籤之間的 HTML的屬性是:innerHTML屬性。

該屬性可以設定或返回元素之間的 HTML。

(2)在DOM物件中,可返回帶有指定標籤名的物件集合的方法是:getElementsByTagName()。

getElementsByTagName(),返回元素的順序也是是它們在文件中的順序。

(3)在DOM物件中,可以設定元素屬性的方法是setAttribute() 方法。

該方法新增指定的屬性,併為其賦指定的值。如果這個指定的屬性已存在,則僅設定/更改值。

第60-62期(2016年5月10日):

(1)在DOM物件中,實現建立元素節點的方法是:appendChild()方法。

此方法向節點新增最後一個子節點。

(2)在DOM物件中,實現把新的節點新增到指定節點的方法是:createElement()方法。

用於建立一個指定元素,所有主要瀏覽器都支援此方法。

(3)在DOM物件中,實現刪除子節點的方法是:removeChild()方法。

此方法指定元素的某個指定的子節點。以 Node 物件返回被刪除的節點,如果節點不存在則返回 null。

第63-65期(2016年5月11日):

(ps:第63期答案:Navigator物件;第64期答案:Screen物件;第65期答案:Location物件;)
(1)在BOM物件中,能夠獲取瀏覽器資訊的物件是:Navigator物件。

Navigator 物件包含有關瀏覽器的資訊,所有瀏覽器都支援該物件。

(2)在BOM物件中,能獲取客戶端螢幕的資訊的物件是:Screen物件。

Screen 物件包含有關客戶端顯示螢幕的資訊。

(3)在BOM物件中,能獲取瀏覽器當前URL資訊的物件是:Location物件。

Location 物件是 Window 物件的一個部分,可通過 window.location 屬性來訪問。

第66-68期(2016年5月12日):

(1)在JavaScript陣列中,實現向陣列末尾新增一個元素的方法是:push()。

此方法可向陣列的末尾新增一個或多個元素,並返回新的長度。

(2)在JavaScript陣列中,實現對陣列的元素進行排序的方法是:sort()。

注意,陣列在原陣列上進行排序,不生成副本。

(3)在JavsScript陣列中,實現把陣列的元素轉成字串,並且用指定的字元分隔開,預設是逗號的方法是:join()。

此方法返回一個字串。該字串是通過把陣列的每個元素轉換為字串,然後把這些字串連線起來。

第69-71期(2016年5月13日):

(1)在事件物件中,表示物件被雙擊時發生的事件:ondblclick。

ondblclick 事件會在物件被雙擊時發生。

(2)在事件物件中,當物件失去焦點時會發生的事件是:onblur。

onblur 事件會在物件失去焦點時發生,常用在輸入域裡面。

(3)在事件物件中,當在域的內容發生改變的時候會觸發的事件是:onchange。

onchange 事件會在域的內容改變時發生。常用在輸入域,下拉選擇,單選多選元件中。

第72-74期(2016年5月16日):

(1)在事件物件中,表示監聽鍵盤按鍵鬆開的是事件是:onkeyup事件。

onkeyup 事件會在鍵盤按鍵被鬆開時發生。

(2)在事件物件中,表示網頁被載入完成的事件是:onload事件。

onload 事件會在頁面或影像載入完成後立即發生。

(3)在事件物件中,監聽滑鼠移動的事件是:onmousemove事件。

 每當使用者把滑鼠移動一個畫素,就會發生一個 mousemove 事件。

第75-77期(2016年5月17日):

(1)程式碼:console.log([] + [] + “foo”.split(“”)); 執行後,控制檯輸出的結果是:f,o,o。

在[] + []的運算過程中,由於使用到了+號,兩個陣列物件均呼叫了自己自帶的toString()方法,將[]轉換成了字串,兩個字串相加還是一個字串。"foo".split(""),將字串分割成字串陣列,為["f", "o", "o"]。最後一步,"" + ["f", "o", "o"],這時候 + 左側是字串,右側是陣列物件,陣列物件依舊會呼叫自身的原型方法,將陣列轉換為字串。

(2)在HTML5的滑鼠事件中,監聽元素被拖動的事件是:ondrag。
(3)在html5的新事件中,當瀏覽器視窗被調整大小的時候會觸發的事件是:onresize事件。

在製作響應式的頁面時候十分有用。

第78-80期(2016年5月18日):

(1)在input元素中,如果是隱藏域型別,type的值是:type=”hidden”。

這種型別的輸入元素實際上是隱藏的。這個不可見的表單元素的 value 屬性儲存了一個要提交給 Web 伺服器的任意字串。

(2)在css中,表示滑鼠懸浮在a標籤上方的偽類是:hover。

hover偽類,常用於修改連結文字的樣式。

(3)在css中,實現把元素設定為固定定位,position的值應該是:fixed。

固定定位後,元素相對瀏覽器視窗來定位,在移動端佈局十分常用。

第81-83期(2016年5月19日):

(1)在W3C標準中,實現元素半透明的css屬性是:opacity。

opacity 屬效能夠設定的值從 0.0 到 1.0。值越小,越透明。

(2)css盒子模型包括了:內容,邊框,內邊距和__外邊距margin__。

我們可以把這4個屬性轉移到我們日常生活中的盒子(箱子)上來理解,日常生活中所見的盒子也就是能裝東西的一種箱子,也具有這些屬性,所以叫它盒子模式。

(3)如果要去除a標籤下面的預設下劃線,可以給a標籤新增css屬性text-decoration,並把值設定為:none。

text-decoration 屬性大多用於去掉連結中的下劃線。

第84-86期(2016年5月20日):

(1)在css屬性中,規定字型的粗細的屬性是:font-weight。

font-weight預設值:normal。

(2)在css屬性中,設定元素的最大寬度的屬性是:max-width。

該屬性值會對元素的寬度設定一個最高限制。因此,元素可以比指定值窄,但不能比其寬。不允許指定負值。

(3)在css屬性中,用於清除元素浮動效果的屬性是:clear。

屬性值可以是:left(清除左浮動)、right(清除右浮動) 、both(清除左右浮動)、none(取消清除)、inherit(繼承父元素的clear值)。

第87-89期(2016年5月23日):

(1)在html的input元素中,用於表單檔案上傳的型別是:file。
(2)在javascript字串物件中,用於定位字串中某一個指定的字元首次出現的位置的方法是:indexOf()方法。

如果指定字串存在,就返回它首次出現的位置,反之返回:-1。

(3)在字串String物件中,實現字串替換的方法是:replace()方法。

使用此方法在字串中用某些字元替換另一些字元。

第90-92期(2016年5月24日):

(1)在JavaScript Number物件中,可以把數字四捨五入為指定的數字的方法是:toFixed()方法。

可以傳入一個引數作為規定小數的位數,是 0 ~ 20 之間的值。

(2)在JavaScript Date物件中,能夠獲取今天是星期幾的方法是:getDay()方法。
(3)在JavaScript Math物件中,實現生成一個0~1之間的隨機數的方法是:Math.random()。

第93-95期(2016年5月25日):

(1)在javascript的全域性函式中, 把字串作為指令碼程式碼來執行的方法是:eval( ) 。

eval() 函式計算 JavaScript 字串,並把它作為指令碼程式碼來執行。如果引數是一個表示式,eval() 函式將執行表示式。

(2)在javascript全域性函式中,解析一個字串並返回一個整數的方法是:parseInt()。

parseInt() 函式可解析一個字串,並返回一個整數。注意: 只有字串中的第一個數字會被返回。

(3)在JavaScript 全域性函式中,檢測某個值是否是數字的函式是:isNaN()。

如果引數值為 NaN 或字串、物件、undefined等非數字值則返回 true, 否則返回 false。

第96-99期(2016年5月26日):

(1)在JavaScript 算術運算子中,代表求餘數的運演算法是:% 運演算法。
(2) 在JavaScript 算術運算子,表示自增的運演算法是: ++ 運算子。
(3)在JavaScript 比較運算子,表示恆等於(值和型別均相等)的運算子是: === 運算子。
(4)在JavaScript 比較運算子中,表示值與型別均不等(不恆等於)的運算子是:!== 運算子。
(5)var a=999; a++; alert(++a); 請問執行後彈出的結果是:1001。

執行a++後的結果是1000,然後執行++a,得到的結果是1001,再執行alert()函式,所以結果是1001。

—————————-(1-99)完結—————————–備註:本人整理,題目來自微信訂閱號webjiaocheng

相關文章