第一章链接：初识JavaScript - 章节课后练习题及答案

第二章链接：JavaScript 基础（上） - 章节课后练习题及答案 

第三章链接：JavaScript 基础（下） - 章节课后练习题及答案

第四章链接：JavaScript 函数 - 章节课后练习题及答案

第五章链接：JavaScript 对象 - 章节课后练习题及答案

注：使用的是人民邮电出版社出版的《JavaScript+jQuery 交互式 Web 前端开发》书籍。

一、填空题

        1、事件的三要素分别是______、______、______。

        2、______方法是根据id来获取元素。

        3、通过______、______、______方式可以修改元素内容。

二、判断题

        1、document.querySelector('div')可以获取文档中第一个div元素。（  ）

        2、Web API包括BOM和DOM两部分组成。（  ）

        3、HTML文档每个换行<br>都是一个文本节点。（  ）

        4、document对象的getElementsByClassName()方法和getElementsByName()方法返回的都是元素对象集合HTMLCollection。（  ）

三、选择题

        1、下面可用于获取文档中第一个div元素的是（  ）。

                A. document.querySelector('div')         B. document.querySelectorAll('div')

                C. document.getElementsByName('div')        D. 以上选项都可以

        2、下列选项中，可以作为DOM的style属性操作的样式名为（  ）。

                A. Background        B. left        C. font-size        D. Textalign

        3、下列选项中，可用于实现动态改变指定div中内容的是（  ）。

                A.console.log()                B. document.write() 

                C. innerHTML                 D. 以上选项都可以

        4、关于获取元素，以下描述正确的是（  ）。

                A. document.getElementById()获取到的是元素集合

                B. document.getElementsByTagName()获取到的是单个元素

                C. document.querySelector()获取到的是元素集合

                D. document.getElementsByClassName()有浏览器兼容性问题

        5、以下代码用于单击一个按钮，弹出对话框。在横线处应填写的正确代码是（  ）。

<button id="btn">唐伯虎</button>
<script>
  var btn = document.getElementById('btn');
  ____________

</script>

                A. btn.onclick = function() { alert('点秋香'); } 

                B. btn.onclick = alert( '点秋香' ); 

                C. btn.click = function() { alert('点秋香'); } 

                D. btn.click()

四、编程题

        请编写代码，实现根据系统时间显示问候语的功能，通过改变div中内容，显示不同问候语。要求如下。

6点之前，显示问候语“凌晨好”。

9点之前，显示问候语“早上好”。

12点之前，显示问候语“上午好”。

14点之前，显示问候语“中午好”。

17点之前，显示问候语“下午好”。

19点之前，显示问候语“傍晚好”。

22点之前，显示问候语“晚上好”。

22点之后包括22点，显示问候语“夜里好”。

参考答案：

一、填空题

1、事件源    事件类型    事件处理程序

2、getElementById()

3、innerHTML    innerText    textContent

二、判断题

1、对        2、对      3、错        4、错

三、选择题

1、A        2、B        3、C        4、D        5、A

四、编程题

        JavaScript代码如下：

<body>
  <div></div>
  <script>
    // 根据系统不同时间来判断，所以需要用到日期内置对象
    // 利用多分支语句来设置不同的图片
    // 1.获取元素
    var div = document.querySelector('div');
    // 2. 得到当前的小时数
    var h = new Date().getHours();
    // 3. 判断小时数改变文字信息
    if(h < 6){
      document.write('凌晨好')
    }else if (h < 9){
      document.write("早上好!")
    }else if (h < 12){
      document.write("上午好!")
    }else if (h < 14){
      document.write("中午好!")
    }else if (h < 17){
      document.write("下午好!")
    }else if (h < 19){
      document.write("傍晚好!")
    }else if (h < 22){
      document.write("晚上好!")
    }else {
      document.write("夜里好!")
}
  </script>
</body>
# javascript
Logo
华为开发者空间

华为开发者空间，是为全球开发者打造的专属开发空间，汇聚了华为优质开发资源及工具，致力于让每一位开发者拥有一台云主机，基于华为根生态开发、创新。

更多推荐

cover

COC云运维中心新特性解读，让智能运维更高效

avatar 华为开发者空间
cover

GaussDB性能调优

avatar 华为开发者空间
cover

简单几步，基于云主机快速为Web项目添加AI助手

avatar 华为开发者空间