Disculpa mi pana, parece que cometí un error en mi respuesta anterior. Aquí te dejo un ejemplo actualizado de cómo se puede mostrar la bandera de un país y su código telefónico en HTML:
```
<!DOCTYPE html>
<html>
<head>
<title>Países del mundo con sus banderas y códigos telefónicos</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<select>
<option value="">Selecciona un país</option>
<option value="AFG">Afganistán</option>
<option value="ALB">Albania</option>
<option value="DZA">Argelia</option>
<option value="ESP">España</option>
<!-- Agregar aquí el resto de los países y sus códigos -->
</select>
<br><br>
<img src="" width="60" height="40" alt="bandera">
<span id="codigo"></span>
<script>
var select = document.querySelector("select");
var imagen = document.querySelector("img");
var codigo = document.querySelector("#codigo");
// Objeto con los códigos telefónicos de cada país
var codigosTelefonicos = {
"AFG": "+93",
"ALB": "+355",
"DZA": "+213",
"ESP": "+34",
// Agregar aquí el resto de los países y sus códigos telefónicos
};
select.addEventListener("change", function() {
var codigoPais = select.value.toLowerCase();
imagen.src = "
https://www.countryflags.io/" + codigoPais + "/flat/64.png";
imagen.alt = select.options[select.selectedIndex].text + " bandera";
codigo.innerText = codigosTelefonicos[codigoPais];
});
</script>
</body>
</html>
```
Este código utiliza la API de "countryflags.io" para mostrar la bandera de un país. En lugar de utilizar la URL de la imagen, se utiliza la URL que proporciona esta API para mostrar la bandera del país seleccionado en el select.
Espero que este ejemplo sea útil. Si tienes alguna otra pregunta o necesitas más ayuda, no dudes en preguntar.