第一章链接：初识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

Redis开源社区持续壮大，华为云为Valkey项目注入新的活力

avatar 华为云开发者联盟
cover

CCE云原生混部场景下的测试案例

avatar 华为云开发者联盟
cover

详解数仓的3A安全能力

avatar 华为云开发者联盟