jquery第五章上机作业

本次jquery第五章上机作业主要是学习基本的DOM操作以及事件处理的相关知识点，通过实现一个简单的交互效果来练习掌握这些技能。下面将分别介绍本次作业需要完成的两个部分。

一、DOM操作

在本次作业中，我们需要实现一个可以动态添加元素的效果。具体步骤如下：

    <div id="addButton">添加</div>
    <ul id="list"></ul>
    
    $(function(){
        $("#addButton").click(function(){
            $("#list").append("<li>新增的元素</li>");
        });
    });

其中，我们通过点击一个按钮（id为“addButton”）来向列表（id为“list”）中添加新元素，使用了jquery封装好的append()函数，通过指定HTML代码来向指定元素末尾插入一个新的子元素，在这里使用了一个简单的字符串来创建元素，这种方式以字符串形式表达HTML代码，非常方便。

二、事件处理

在这个任务中，我们需要实现点击列表项后，将其背景色变为红色的效果。代码如下：

    $("#list").on("click","li",function(){
        $(this).css("background-color","red");
    });

在这里，我们需要给整个列表元素（id为“list”）添加一个事件处理函数，使用 on() 函数实现事件绑定，通过指定第二个参数“li”来指定在列表项上绑定事件。当点击俄列表中某一项时，回调函数中的 $(this) 就代表了当前被点击的那个元素身上，我们使用 css() 函数来改变这个元素的样式，将其背景色设置为红色。

综上所述，本次jquery第五章上机作业内容涉及DOM操作以及事件处理的知识点，我们学习了动态添加元素和点击事件处理的相关技能点，更深入了解了jquery库提供的函数和方法。