如何在不使用 HTML 和 CSS 中的 text-shadow 的情况下创建文本的长阴影？

在不使用 HTML 和 CSS 中的 text-shadow 的情况下如何创建文本的长阴影呢？我们可以使用纯 JavaScript 来实现这个功能。

具体步骤如下：

1. 获取要添加阴影的文本元素

const text = document.querySelector('#text');

2. 创建一个 div 元素来承载阴影

const shadow = document.createElement('div');

3. 将原文本内容赋值给 div 元素

shadow.textContent = text.textContent;

4. 设置 div 元素的样式

shadow.style.position = 'absolute';
shadow.style.left = '2px';
shadow.style.top = '2px';
shadow.style.color = '#888888';

5. 将 div 元素添加到文本元素的父元素中

text.parentNode.insertBefore(shadow, text);

6. 完成！现在你已经成功地创建了文本的长阴影。

完整代码片段如下：

const text = document.querySelector('#text');
const shadow = document.createElement('div');
shadow.textContent = text.textContent;
shadow.style.position = 'absolute';
shadow.style.left = '2px';
shadow.style.top = '2px';
shadow.style.color = '#888888';
text.parentNode.insertBefore(shadow, text);