進階八

題目1: dom對象的innerText和innerHTML有什么區(qū)別党涕?

innerHtml 屬性 可以用來讀饿敲、寫某給定的html內(nèi)容。
1)區(qū)別一 讀取的時候區(qū)別從對象起始位置到終止位置的全部內(nèi)容嗤瞎,包括html標簽

<div id="ct">
  <p id="p1">hello world </p>
 </div>
 document.getElementById('ct').innerHtml   //<p id="p1">hello world </p>
 返回的是id為ct的所有標簽及內(nèi)容。

document.getElementById('ct').innerText   // hello world
返回的是id為ct的內(nèi)容听系,但是除去了html標簽贝奇。

2)區(qū)別二 在個給定的html內(nèi)容寫的時候區(qū)別

  document.getElementById('ct').innerHtml=‘![](chrome-search://thumb/2/2)’
   是將整個內(nèi)容作為html寫入文檔中。

 document.getElementById('ct').innerText =‘hello’
 是把hello作為文本放入指定的元素內(nèi)部靠胜。

題目2: elem.children和elem.childNodes的區(qū)別掉瞳?

children:子元素列表(HTMLCollection)返回指定元素的子元素集合,經(jīng)測試浪漠,它只返回html節(jié)點陕习,不返回文本節(jié)點。
childNodes:可以用來獲取任何一個元素的所有子元素址愿,他是一個包含這個元素全部子元素的數(shù)組该镣。包括文本節(jié)點。

<div id="ct">
    ![](chrome-search://thumb/2/2)
    <p>1233</p>
    <a href="#">提交</a>
</div>

document.getElementsByTagName('div')[0].childNodes // [text, img, text, p, text, a, text]

document.getElementsByTagName('div')[0].children     //[img, p, a]

題目3:查詢元素有幾種常見的方法响谓?ES5的元素選擇方法是什么?

1)getElementById() 返回匹配指定的ID元素的節(jié)點损合。沒有匹配返回null
2)getElementsByClassName() 返回一個類數(shù)組的對象。包括所有class名字符合指定條件的元素娘纷。
3)getElementsByTagName()返回所有指定標簽的元素嫁审。
4)getElementsByName() 用于選擇擁有name屬性的html元素。
es5方法
1)querySelector() 返回匹配指定的css選擇器的元素節(jié)點失驶。如果有多個滿足土居,則返回第一個。
2)querySelectorAll()返回匹配指定的CSS選擇器的所有節(jié)點

題目4:如何創(chuàng)建一個元素?如何給元素設置屬性擦耀?如何刪除屬性

   var elem= document.createElement('img');  //創(chuàng)建元素
   elem.setAttribute('src','chrome-search://thumb/2/1');   // 設置屬性
   elem.removeAttribute('src');    // 刪除屬性

題目5:如何給頁面元素添加子元素棉圈?如何刪除頁面元素下的子元素?

 添加子元素:  
<div id="ct">
</div>

 var ct=  document.getElementById('ct');
var node=document.createElement('p');
ct.appendChild(node);  //增加子元素
ct.removeChild(node);  刪除子元素

題目6: element.classList有哪些方法?如何判斷一個元素的 class 列表中是包含某個 class分瘾?如何添加一個class?如何刪除一個class?

<h1 class="title">my title</h1>
var title=document.querySelector('.title');
 title.classList.add('active')    //<h1 class="title active">my title</h1> 添加class active
title.classList.remove('title');    //  <h1 class="active">my title</h1>   //刪除clas
 title.classList.contains('active')   // true  判斷是否包含某個clas

題目7: 如何選中如下代碼所有的li元素德召? 如何選中btn元素汽纤?

<div class="mod-tabs">
 <ul>
   <li>list1</li>
   <li>list2</li>
   <li>list3</li>
 </ul>
   <button class="btn">點我</button>
</div>

li元素:
document.getElementsByTagName("li");
document.querySelectorAll("li")

btn元素
document.getElementsByClassName("btn")
document.querySelectorAll(".btn")

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末上岗,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子蕴坪,更是在濱河造成了極大的恐慌,老刑警劉巖背传,帶你破解...
    沈念sama閱讀 211,639評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異径玖,居然都是意外死亡痴脾,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,277評論 3 385
  • 文/潘曉璐 我一進店門梳星,熙熙樓的掌柜王于貴愁眉苦臉地迎上來赞赖,“玉大人丰泊,你說我怎么就攤上這事⊥海” “怎么了?”我有些...
    開封第一講書人閱讀 157,221評論 0 348
  • 文/不壞的土叔 我叫張陵年堆,是天一觀的道長盏浇。 經(jīng)常有香客問我变丧,道長绢掰,這世上最難降的妖魔是什么童擎? 我笑而不...
    開封第一講書人閱讀 56,474評論 1 283
  • 正文 為了忘掉前任攻晒,我火速辦了婚禮,結(jié)果婚禮上鲁捏,老公的妹妹穿的比我還像新娘。我一直安慰自己给梅,他們只是感情好,可當我...
    茶點故事閱讀 65,570評論 6 386
  • 文/花漫 我一把揭開白布包帚。 她就那樣靜靜地躺著曹质,像睡著了一般。 火紅的嫁衣襯著肌膚如雪羽德。 梳的紋絲不亂的頭發(fā)上迅办,一...
    開封第一講書人閱讀 49,816評論 1 290
  • 那天宅静,我揣著相機與錄音站欺,去河邊找鬼。 笑死矾策,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的逃糟。 我是一名探鬼主播,決...
    沈念sama閱讀 38,957評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼绰咽,長吁一口氣:“原來是場噩夢啊……” “哼地粪!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起蟆技,我...
    開封第一講書人閱讀 37,718評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎旺聚,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體翻屈,經(jīng)...
    沈念sama閱讀 44,176評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,511評論 2 327
  • 正文 我和宋清朗相戀三年惊窖,在試婚紗的時候發(fā)現(xiàn)自己被綠了厘贼。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,646評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡毁欣,死狀恐怖岳掐,靈堂內(nèi)的尸體忽然破棺而出凭疮,到底是詐尸還是另有隱情串述,我是刑警寧澤,帶...
    沈念sama閱讀 34,322評論 4 330
  • 正文 年R本政府宣布衰腌,位于F島的核電站,受9級特大地震影響右蕊,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜饶囚,卻給世界環(huán)境...
    茶點故事閱讀 39,934評論 3 313
  • 文/蒙蒙 一规脸、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧莫鸭,春花似錦、人聲如沸被因。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,755評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至缘挽,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間壕曼,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,987評論 1 266
  • 我被黑心中介騙來泰國打工摹蘑, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留轧飞,地道東北人。 一個月前我還...
    沈念sama閱讀 46,358評論 2 360
  • 正文 我出身青樓过咬,卻偏偏與公主長得像,于是被迫代替她去往敵國和親援奢。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,514評論 2 348

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

  • 1. dom對象的innerText和innerHTML有什么區(qū)別? innerText是一個可寫屬性具篇,返回元素內(nèi)...
    饑人谷_流水閱讀 92評論 0 0
  • 基本介紹 文檔對象模型 (DOM) 是HTML和XML文檔的編程接口凌埂。它給文檔(結(jié)構(gòu)樹)提供了一個結(jié)構(gòu)化的表述并且...
    草鞋弟閱讀 431評論 0 0
  • 題目1: dom對象的innerText和innerHTML有什么區(qū)別? innerText返回的是元素內(nèi)包含的文...
    Feiyu_有貓病閱讀 370評論 0 0
  • 棧 棧只允許訪問一個數(shù)據(jù)項:即最后插入的數(shù)據(jù)埃疫。溢出這個數(shù)據(jù)才能訪問倒數(shù)第二個插入的數(shù)據(jù)項孩哑。它是一種"后進先出"的數(shù)...
    藍天的歌者閱讀 355評論 0 0
  • 姓名:李俊秀 公司:寧波大發(fā)化纖有限公司 期數(shù):六項精進259期學員 組別:感謝一組 【日精進打卡第60天】 【知...
    花語花香9閱讀 210評論 0 0