本文教你使用纯 javascript 将书籍对象数组转换为结构化 html 无序列表，其中每位作者名以 `` 标签加粗显示，并与书名按“作者：书名”格式组合呈现。
在前端开发中，常需将结构化数据（如对象数组）动态渲染为语义清晰的 HTML 列表。你提供的代码已成功创建
- 元素并循环生成
- ，但尚未向列表项中注入内容。关键在于：每个
- 应包含两个子节点——一个加粗的作者信息（），以及一个普通文本形式的书名（Text Node）。
以下是优化后的完整实现（含注释和最佳实践）：
✅ 关键要点说明：
- 使用 textContent 而非 innerHTML 设置文本内容，防止 XSS 风险且性能更优；
- 直接操作 .id 属性比 setAttribute("id", ...) 更符合现代 DOM API 规范；
- 在循环外缓存 document.getElementById("myDiv")，避免重复 DOM 查询；
- 不要多次调用 document.getElementById("myUL") —— 直接复用已创建的 myUL 引用，提升可读性与性能。
最终渲染效果完全匹配需求：
立即学习“Java免费学习笔记（深入）”；
- JK Rowling: Harry Potter
- Suzanne Collins: Hunger Games
- ……以此类推
该方案轻量、可维护、语义正确，适用于任何类似的数据驱动列表场景。
- 应包含两个子节点——一个加粗的作者信息（），以及一个普通文本形式的书名（Text Node）。
