網(wǎng)易微專業(yè)之《前端工程師》學(xué)習(xí)筆記（16）-DOM單元測試客觀題

一、單選(2分)
如果html元素’<div>歡迎<a href="/profile">Jerry</a>同學(xué)!</div>’對應(yīng)的DOM節(jié)點(diǎn)是element，那么element.children.length的值為

  • A.4

  • B.5

  • C.2

  • D.1

解：選D。這題考的是children的知識點(diǎn)，children和childNodes的區(qū)別是，children只返回元素子節(jié)點(diǎn)，ChildNodes可以返回很多類型的節(jié)點(diǎn)，之所以會出現(xiàn)children這個(gè)屬性，也是因?yàn)樵贗E9以前版本與其他瀏覽器在處理文本節(jié)點(diǎn)中的空白節(jié)點(diǎn)的時(shí)候出現(xiàn)差異。children選擇的子節(jié)點(diǎn)由于是只選擇元素節(jié)點(diǎn)，所以作為文本節(jié)點(diǎn)的空白節(jié)點(diǎn)是不會被選擇的，而childNodes則會。childNodes的空白符在IE的childNodes是不包含空白符 其他瀏覽器包含空白符。

二、單選(2分)
如果html元素’ <button disabled></button>’對應(yīng)的DOM節(jié)點(diǎn)是button，那么button.disabled的值為

  • A.false

  • B.0

  • C.1

  • D.true

解：選D。disabled=true默認(rèn)是默認(rèn)值，是使按鈕失效。

可以拿下面的代碼去chorme的調(diào)試工具里測試下。

var button=document.getElementsByTagName("button");
button[0].disabled；
//true

三、單選(2分)
W3C定義用來阻止a標(biāo)簽?zāi)J(rèn)事件的方法是

  • A.e.returnValue = false

  • B.e.preventDefault()

  • C.e.stopImmediatePropagation()

  • D.e.stopPropagation()

解：選B。e.preventDefault()方法是用于取消事件的默認(rèn)行為，一般cancelable為true時(shí)候可以使用這個(gè)方法，但此方法并不被ie支持，在ie下需要用window.event.returnValue = false; 來實(shí)現(xiàn)。e.stopImmediatePropagation是取消事件的進(jìn)一步捕獲或冒泡，同時(shí)阻止任何事件處理程序被調(diào)用。e.stopPropagation是取消事件的進(jìn)一步捕獲或冒泡，如果bubbles為true的時(shí)候，可以用這個(gè)方法。bubbles是判斷事件是否冒泡。

四、單選(2分)
事件模型的第一個(gè)階段是

  • A.選中

  • B.目標(biāo)

  • C.冒泡

  • D.捕獲

解：選D，事件的模型一般分為三個(gè)階段：捕獲-->目標(biāo)-->冒泡。

五、單選(2分)
多媒體的音量屬性volume的取值范圍是

  • A.1~100

  • B.1~10

  • C.0~100

  • D.0~1

解：選D。音量屬性volume的取值必須是介于 0.0 與 1.0 之間的數(shù)字。

六、單選(2分)
根據(jù)navigator的以下哪個(gè)屬性，可以判斷出瀏覽器的內(nèi)核信息

  • A.appVersion

  • B.appName

  • C.platform

  • D.userAgent

解：選D，appVersion是完整的瀏覽器版本，appName是瀏覽器名稱，platform是平臺的名稱，比如Win32。userAgent 屬性是一個(gè)只讀的字符串，聲明了瀏覽器用于HTTP請求的用戶代理頭的值。一般來講，它是在 navigator.appCodeName 的值之后加上斜線和 navigator.appVersion 的值構(gòu)成的。這題AD都可以的估計(jì)，保險(xiǎn)起見選D了。

七、單選(2分)
下面哪個(gè)對話框允許用戶輸入

  • A.window

  • B.iframe

  • C.alert

  • D.prompt

解：選D。

八、單選(2分)
以下表示請求成功的http狀態(tài)碼是

  • A.400

  • B.200

  • C.404

  • D.500

解：選B。這些http的狀態(tài)碼分別代表的意思是：

狀態(tài)碼 描述
400 1、語義有誤，當(dāng)前請求無法被服務(wù)器理解。除非進(jìn)行修改，否則客戶端不應(yīng)該重復(fù)提交這個(gè)請求。2、請求參數(shù)有誤。
200 請求已成功
404 請求失敗，請求所希望得到的資源未被在服務(wù)器上發(fā)現(xiàn)。沒有信息能夠告訴用戶這個(gè)狀況到底是暫時(shí)的還是永久的。假如服務(wù)器知道情況的話，應(yīng)當(dāng)使用410狀態(tài)碼來告知舊資源因?yàn)槟承﹥?nèi)部的配置機(jī)制問題，已經(jīng)永久的不可用，而且沒有任何可以跳轉(zhuǎn)的地址。404這個(gè)狀態(tài)碼被廣泛應(yīng)用于當(dāng)服務(wù)器不想揭示到底為何請求被拒絕或者沒有其他適合的響應(yīng)可用的情況下。
500 服務(wù)器遇到了一個(gè)未曾預(yù)料的狀況，導(dǎo)致了它無法完成對請求的處理。一般來說，這個(gè)問題都會在服務(wù)器的程序碼出錯時(shí)出現(xiàn)。

九、單選(2分)
通過設(shè)置以下哪個(gè)cookie屬性可以刪除一個(gè)cookie值

  • A.http

  • B.expires

  • C.path

  • D.name

解：選B。一般設(shè)置cookie的失效時(shí)間沒也就是應(yīng)該被刪除的時(shí)間戳，就可以刪除cookie。

十、單選(2分)
如果在表單中通過’<input type="file">’元素上傳png格式的圖片文件，表單的enctype值為

  • A."multipart/form-data"

  • B."image/png"

  • C."text/plain"

  • D."text/html"

解：選A。BD是錯誤的，沒有這個(gè)值。enctype的值如下：

enctype值 描述
application/x-www-form-urlencoded 在發(fā)送前編碼所有字符（默認(rèn)）
multipart/form-data 不對字符編碼。在使用包含文件上傳控件的表單時(shí)，必須使用該值。
text/plain 空格轉(zhuǎn)換為 "+" 加號，但不對特殊字符編碼。

十一、多選(4分)
如果html元素’ <div id="user" data-first-name="Wei">aq</div>’對應(yīng)的DOM節(jié)點(diǎn)是element，那么以下選項(xiàng)中哪些值為"Wei"

  • A.element.getAttribute("first-name")

  • B.element.dataset["data-first-name"]

  • C.element.dataset.firstName

  • D.element.getAttribute("data-first-name")

解：選CD。這題考的是自定義屬性該怎么獲取。有兩種方式吧。一種是用getAttribute，只不過element.getAttribute(完整屬性名)，參數(shù)是必須填的。第二種辦法就是用dataset，這其實(shí)是個(gè)API[element.datasetAPI]從火狐6和Chrome8起就開始對它有了支持。這個(gè)API能夠讓用戶get或setHTML頁面元素上的data-*屬性。用法看下面：

用點(diǎn)使用data-*屬性名時(shí)，要把名稱轉(zhuǎn)變成駝峰式命名(Camel-Case)，比如像C選項(xiàng)那樣的，使用dataset的話可以省略data，直接寫下面的屬性名。比如舉個(gè)栗子：

<div id="myDiv" data-name="myDiv" data-id="myId" data-my-custom-key="This is the value"></div>

要想獲取這個(gè)data-id屬性，你的代碼應(yīng)該寫成這樣：

var element = document.getElementById("myDiv");
var id = element.dataset.id;

要想獲取data-my-custom-key屬性值，你的代碼應(yīng)該寫成這樣：

var customKey = element.dataset.myCustomKey;

十二、多選(4分)
如果html元素’ <p style="line-height: 200px;">網(wǎng)易一線資深工程師</p>’對應(yīng)的DOM節(jié)點(diǎn)是element，那么以下表達(dá)式中值為"200px"的有

  • A.element.style.substring(13,-1)

  • B.element.style.lineHeight

  • C.element.style.cssText.slice(13,-1)

  • D.element.style.cssText.lineHeight

解：選BC。首先這是內(nèi)部樣式表，所以用element.style。如果是外部樣式表，或者寫在<style></style>里的，就用element.sheet.cssRule[下標(biāo)].style.lineHeight了?？聪旅娴睦踝印?/p> 

//css
<style>
p{line-height: 200px;}
</style>

//html
<p >網(wǎng)易一線資深工程師</p>
就用
element.sheet.cssRule[0].style.lineHeight

如果是行內(nèi)樣式的話

<p style="line-height: 200px;">網(wǎng)易一線資深工程師</p>

就用
element.style.lineHeight

cssText是讀寫都是整條讀寫的，所以D是會報(bào)錯的。substring（開始位置，結(jié)束位置）是提取字符串的返回子串的方法，slice（開始位置，結(jié)束位置）是選取一部分的方法。，不同的是element.style是一個(gè)樣式的list對象，所以A會報(bào)錯的。

十三、多選(4分)
下面屬于鼠標(biāo)事件的有

  • A.input

  • B.mousedown

  • C.mouseenter

  • D.click

解：選BCD

十四、多選(4分)
下面哪些事件可以冒泡

  • A.focus

  • B.click

  • C.load

  • D.input

解：選AB。

十五、多選(4分)
下面哪些方式可以實(shí)現(xiàn)瀏覽器當(dāng)前窗口跳轉(zhuǎn)到“http://www.163.com”

解：選BCD。

十六、多選(4分)
兩個(gè)頁面如果屬于同源，那么它們的url中哪幾項(xiàng)是相同的?

A.port

B.url

C.protocol

D.host

解：選ACD。url包括如下，同源的意思是host一致，protocol一致，端口一致。

十七、多選(4分)
以下哪幾個(gè)屬性的組合是可以唯一標(biāo)識一個(gè)cookie值

  • A.path

  • B.domain

  • C.name

  • D.secure

解：選ABC。

十八、多選(4分)
以下哪些是cookie的屬性

  • A.path

  • B.domain

  • C.name

  • D.value

解：選ABCD。

十九、多選(4分)
以下哪些方案可以進(jìn)行瀏覽器端的存儲

  • A.mysql

  • B.cookie

  • C.indexedDB

  • D.localStorage

解：BCD。A是服務(wù)器端的存儲。

二十、多選(4分)
如果html元素’<select id="age"></select>’對應(yīng)的DOM節(jié)點(diǎn)是age，那么以下選項(xiàng)中可以創(chuàng)建age元素的選項(xiàng)(即option元素)的有

  • A.age.options.add()

  • B.document.createElement("option")

  • C.age.add()

  • D.new Option()

解：選BD

二十一、判斷(1分)
head元素里的內(nèi)容不會在頁面中顯示, 因此也不會解析成文檔樹中的節(jié)點(diǎn)

  • A.×

  • B.√

解：A。

二二、判斷(1分)
如果html元素對應(yīng)的DOM節(jié)點(diǎn)為element,那么element.class能夠獲取到該元素的類名

  • A.×

  • B.√

解：A。element.className。

二十三、判斷(1分)
如果html元素對應(yīng)的DOM節(jié)點(diǎn)為element,那么element.style能夠獲取到該元素的實(shí)際樣式

  • A.×

  • B.√
    解：A，element.style是一個(gè)樣式對象。

二四、判斷(1分)
如果html元素對應(yīng)的DOM節(jié)點(diǎn)為element, element.sheet能夠獲取到該元素的實(shí)際樣式

  • A.×

  • B.√

解：A。

二五、判斷(1分)
<audio>的屬性autoplay和preload可以同時(shí)生效

  • A.√

  • B.×

解：選B。preload屬性規(guī)定是否在頁面加載后載入音頻。 如果設(shè)置了 autoplay屬性,則忽略該屬性。

二六、XMLHttpRequest對象發(fā)送請求前，一定要先設(shè)置http頭部信息

  • A.×

  • B.√

解：選A。

二七、判斷(1分)
調(diào)用XMLHttpRequest.open()方法，會向服務(wù)器發(fā)送數(shù)據(jù)

  • A.√

  • B.×

解：選B。

二八、判斷(1分)
調(diào)用XMLHttpRequest.send()方法，一定要傳入?yún)?shù)

  • A.×

  • B.√

解：選A。

二九、判斷(1分)
cookie是存儲在瀏覽器端的

  • A.√

  • B.×

解：選A。

三十、判斷(1分)
requestAnimationFrame可以自定義時(shí)間間隔

  • A.×

  • B.√
    解：setTimeout和setInterval才可以自定義時(shí)間間隔，requestAnimationFrame只傳一個(gè)回調(diào)函數(shù)即可，它比前兩個(gè)流暢。

三一、填空(2分)
如果html元素’ <ul id="courses"><li id="x">實(shí)用技能</li><li id="y">高等教育</li></ul>’中id為x的元素對應(yīng)的DOM節(jié)點(diǎn)為x, 那么x.__________________屬性可以獲取到id為courses的元素。

解：parentNode

三二、填空(2分)
如果表單’ <form><input id="userName" name="userName"></form>’對應(yīng)的DOM節(jié)點(diǎn)是form，現(xiàn)在要獲取input節(jié)點(diǎn), 以下是實(shí)現(xiàn)這個(gè)操作對應(yīng)的代碼，請補(bǔ)全代碼:
var input = document._________________ ('userName');

解：getElementById。

三三、填空(2分)
如果要創(chuàng)建html為’<label>用戶名：</label>’的DOM節(jié)點(diǎn), 以下是實(shí)現(xiàn)這個(gè)操作對應(yīng)的代碼，請補(bǔ)全代碼:
var label = document._________________('label');
label.textContent = "用戶名：";

解：createElement。

三四、填空(2分)
如果表單’ <form><input id="userName" name="userName"></form>’對應(yīng)的DOM節(jié)點(diǎn)是form， input元素對應(yīng)的DOM節(jié)點(diǎn)為input, 現(xiàn)在在form下面添加節(jié)點(diǎn)label，添加后form對應(yīng)的html元素為’ <form><label>用戶名：</label><input id="userName" name="userName"> </form>’, 以下是實(shí)現(xiàn)這個(gè)操作對應(yīng)的代碼，請補(bǔ)全代碼:
form._________________(label, input);

解：insertBefore。

三五、填空(2分)
如果手機(jī)號輸入框’<input id="mobile" type="text">’對應(yīng)的DOM節(jié)點(diǎn)是mobile，現(xiàn)在要獲取該輸入框的type屬性，以下是實(shí)現(xiàn)這個(gè)操作對應(yīng)的代碼，請補(bǔ)全代碼：
mobile.__________________("type" );

解：getAttribute。

三六、填空(2分)
如果內(nèi)部樣式表
<style>
.m-nav{font-size: 14px;}
.m-nav li{width: 100px;padding-left: 20px;}
</style>
對應(yīng)的DOM節(jié)點(diǎn)是element，那么要獲取樣式表中第二條規(guī)則中padding-left的屬性值, 以下是實(shí)現(xiàn)這個(gè)操作對應(yīng)的代碼，請補(bǔ)全代碼:
element.sheet.cssRules[1].style._____________
解：paddingLeft

三七、填空(2分)
通過audio元素的_______________方法可以測試瀏覽器對音頻資源的兼容性

解：canPlayType檢查瀏覽器是否能夠播放指定的音頻類型。

三八、填空(2分)
在form的________________事件響應(yīng)函數(shù)中可以阻止表單提交。

解：onsubmit

三九、填空(2分)
使用form的____________方法可以重置表單。

解：reset。

四十、填空(2分)
如果手機(jī)號輸入框’ <input id="mobile" value="13565346787">’對應(yīng)的DOM節(jié)點(diǎn)是mobile，那么以下代碼實(shí)現(xiàn)選中輸入框中的內(nèi)容，請補(bǔ)全代碼:
mobile._______________();

解：select

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案？ 參考答案 (1)瀏覽器兼容問題一：不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,153評論 1贊 92
  • 【1】7，9，-1，5，( ) A、4；B、2；C、-1；D、-3 分析:選D，7+9=16；9+（-1）=8；（...
    Alex_bingo閱讀 19,808評論 1贊 19
  • 人為什么不能接受別人意見？ 背后大部分原因不是自以為是、心胸狹小……這是只是表象，真正的原因是內(nèi)心深深的自卑。 自...
    國仕空間閱讀 545評論 0贊 0
  • 堅(jiān)持，是一個(gè)爛在人們耳邊的話。一個(gè)飽含人生哲理的廢話。同時(shí)又逃不開成為成功的秘訣之一。 世上努力的人很多，堅(jiān)持努力...
    愛面包的四夕閱讀 394評論 0贊 4
  • 大部分人缺失的根本不是錢，而是對生活的熱情、對美好生活的向往和追求，以及這些強(qiáng)烈的追求和熱情所激發(fā)出來的奇思妙想。...
    菲樂閱讀 258評論 0贊 2

友情鏈接更多精彩內(nèi)容