简单的ES6模块import改变文字颜色实例页面

回到相关文章 »

效果：

我是p，我的颜色是？

代码：

HTML代码：

<p>我是p，我的颜色是？</p>

script代码：

<script type="module">
  // 导入firstBlood模块
  import { pColor } from './firstBlood.mjs';
  // 设置颜色为红色
  pColor('red');
</script>

firstBlood.mjs代码：

// export一个改变p元素颜色的方法
export function pColor (color) {
  const p = document.querySelector('p');
  p.style.color = color;
}