JS-操作元素节点属性-选择喜欢的书籍

ZehaoZ

于 2020-12-08 23:43:09 发布

阅读量1k

点赞数 1

分类专栏： JavaScript 文章标签： javascript js

本文链接：https://blog.youkuaiyun.com/weixin_45080761/article/details/110913078

版权

这篇博客介绍如何使用JavaScript操作HTML元素属性来实现选择书籍的功能。讲解了通过获取DOM元素，判断单选按钮的checked状态，并利用setAttribute和getAttribute方法设置和获取元素属性，结合innerHTML更新页面显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

选择喜欢的书籍

实现思路

获取单选按钮radio、图片img、div对象
判断单选按钮对象的checked属性，为true表示被选中，为false表示未被选中
利用element.setAttribute(‘attr’,‘value’); 设置元素对象的属性
利用element.getAttribute(‘attr’); 获取元素对象的属性
利用innerHTML，将元素对象的属性写入对应HTML元素

HTML

<div>
    选择你喜欢的书:
    <!-- 给单选按钮绑定鼠标点击事件,关联事件处理程序show() -->
    <!-- checked 默认选中第一个 -->
    <input type="radio" name="book" checked onclick="show()">我和狗狗一起活下来
    <input type