BFE.devでのAI解答例 - フロントエンド面接質問
118. Skeleton Screenとは？どう実装する？

Skeleton Screenを実装する方法は、以下のようになります。

1. HTMLにSkeleton Screenのマークアップを追加する。
2. CSSで、Skeleton Screenのスタイルを定義する。
3. JavaScriptで、Skeleton Screenを表示/非表示にする制御を行う。

具体的には、以下の手順で実装することができます。

1. HTMLにSkeleton Screenのマークアップを追加する。

   <div class="skeleton"></div>

2. CSSで、Skeleton Screenのスタイルを定義する。 ```js .skeleton { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #f3f3f3; animation: pulse 1.2s infinite; }

@keyframes pulse { 0% { background-color: #f3f3f3; } 50% { background-color: #e6e6e6; } 100% { background-color: #f3f3f3; } }

3. JavaScriptで、Skeleton Screenを表示/非表示にする制御を行う。
```js
// Skeleton Screenを表示する
document.querySelector('.skeleton').classList.add('show');

// Skeleton Screenを非表示にする
document.querySelector('.skeleton').classList.remove('show');

以上が、Skeleton Screenを実装するための基本的な手順です。ただし、詳細な実装方法は、サイトによって異なる場合があります。