~~~ <div class="box" id="box" style="width: 500px;"> <h2 class="title">珠峰课程体系</h2> <ul> <li>HTML5+CSS3</li> <li>JavaScript（ES6）基础知识、核心原理、项目实战、组件封装、设计模式等</li> <li>AJAX和HTTP</li> <li>Vue/React/小程序开发的全家桶（基础、源码、实战）</li> <li>Webpack/Node/Git等常用的工具类或者全栈化</li> </ul> </div> 学会这些找一份工作，SO EASY！ <!-- IMPORT JS --> <script> /* * JS的三部分组成： * ECMAScript 3 / 6 * DOM：document object model 文档对象模型（提供一系列的属性和方法，让我们能操作页面中的DOM元素->简单理解为操作页面中的HTML标签） * BOM */ /* * 获取DOM元素 * document.getElementById([ID]) 基于元素的ID获取到这个元素（一个元素对象） * document.body 获取页面中的BODY元素 * document.getElementsByTagName([标签名]) 根据标签名获取到页面中（指定容器中）所有的元素标签集合 （一组元素集合） */ //=>基于JS获取到的DOM元素是“对象数据类型”值，里面包含很多浏览器自带的，用来操作元素的键值对 对象->堆内存，在这个堆中存储了很多内置的键值对，style存储的是它的“行内样式”，style行内样式 会有很多，所以style本身也是一个对象（堆） // 修改盒子中文字颜色样式的三种写法，哪一种可以？ /* let box = document.getElementById('box'); // box.style.color = 'red'; // let boxSty = box.style; //=>获取的是STYLE对应的对象 BBBFFF000 // boxSty.color = 'red'; let text = box.style.color; //=>获取的是color初始值''，基本类型值，直接存在栈内存中 text = 'red'; */ </script> ~~~