小伙伴们在前端开发中，经常需要操作DOM元素的内容展示，这时就离不开`innerText`和`innerHTML`这两个属性啦！😎

一、innerText用法

`innerText`用于获取或设置指定元素的文本内容，它会忽略HTML标签，只返回纯文本哦！例如：

```javascript

const div = document.querySelector('div');

div.innerText = 'Hello World'; // 设置纯文本内容

console.log(div.innerText); // 输出：Hello World

```

二、innerHTML用法

而`innerHTML`则可以读取或写入包含HTML标签的内容。比如：

```javascript

div.innerHTML = '

Hello World

console.log(div.innerHTML); // 输出：

Hello World

```

但它有风险，容易被注入恶意代码，所以使用时需谨慎⚠️！

三、注意事项

1. 修改`innerText`不会触发浏览器重新渲染HTML结构，性能更优；

2. 修改`innerHTML`可能会导致页面重绘，影响性能，务必小心使用；

3. 如果目标是纯文本操作，优先选择`innerText`，避免潜在的安全隐患。

掌握它们的区别和应用场景，能让你的代码更加高效且安全！💪