Pour créer un code JavaScript pour un accessoire destiné aux employés internes, nous pouvons imaginer un scénario où vous souhaitez gérer une liste d’accessoires et permettre aux employés de réserver ces accessoires. Voici un exemple de code JavaScript simple avec HTML et CSS pour créer une interface de gestion des accessoires.

### HTML (index.html)
« `html

« `

### CSS (styles.css)
« `css
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}

.container {
background-color: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 300px;
text-align: center;
}

h1 {
font-size: 24px;
margin-bottom: 20px;
}

.form-container {
display: flex;
margin-bottom: 20px;
}

input[type= »text »] {
flex: 1;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
}

button {
padding: 10px 20px;
background-color: #007bff;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}

button:hover {
background-color: #0056b3;
}

ul {
list-style-type: none;
padding: 0;
}

li {
background-color: #f9f9f9;
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ddd;
border-radius: 4px;
display: flex;
justify-content: space-between;
align-items: center;
}

li button {
background-color: #dc3545;
color: white;
border: none;
border-radius: 4px;
padding: 5px 10px;
cursor: pointer;
}

li button:hover {
background-color: #c82333;
}
« `

### JavaScript (script.js)
« `javascript
// Script for managing accessories

function addAccessory() {
const accessoryInput = document.getElementById(‘accessoryInput’);
const accessoryName = accessoryInput.value.trim();

if (accessoryName ===  ») {
alert(‘Veuillez entrer le nom de l\’accessoire.’);
return;
}

const accessoryList = document.getElementById(‘accessoryList’);
const listItem = document.createElement(‘li’);
listItem.textContent = accessoryName;

const deleteButton = document.createElement(‘button’);
deleteButton.textContent = ‘Supprimer’;
deleteButton.onclick = () => accessoryList.removeChild(listItem);

listItem.appendChild(deleteButton);
accessoryList.appendChild(listItem);

accessoryInput.value =  »;
}

// Function to delete an accessory
function deleteAccessory(event) {
const listItem = event.target.parentElement;
listItem.remove();
}
« `

### Instructions pour Utilisation
1. **Créez un nouveau dossier pour votre projet.**
2. **Ajoutez trois fichiers** : `index.html`, `styles.css`, et `script.js`.
3. **Copiez et collez** le code fourni dans les fichiers respectifs.
4. **Ouvrez `index.html`** dans votre navigateur pour voir l’interface de gestion des accessoires.

Ce code vous donnera une interface simple où vous pouvez ajouter et supprimer des accessoires pour les employés internes.