<p><text id="greeting" src="lookup.json"></p>

{
    "greeting": {
        "en": "Hello world",
        "es": "Hola mundo"
    }
}

- URL: index.html?lang=en → Hello world

- URL: index.html?lang=es → Hola mundo

<p><text id="welcome" src="lookup.json">, user!</p>

{
    "welcome": {
        "en": "Welcome",
        "es": "Bienvenido"
    }
}

- URL: index.html?lang=en → Welcome, user!

- URL: index.html?lang=es → Bienvenido, user!

<p>
    <text id="hello" src="lookup.json">
    <text id="world" src="lookup.json">
</p>

{
    "hello": {
        "en": "Hello",
        "es": "Hola"
    },
    "world": {
        "en": "World",
        "es": "Mundo"
    }
}

- URL: index.html?lang=en → Hello World

- URL: index.html?lang=es → Hola Mundo

<p>
    <text id="info" src="lookup.json">
    <a href="https://example.com"><text id="read more" src="lookup.json"></a>
</p>

{
    "info": {
        "en": "This project is open-source.",
        "es": "Este proyecto es de código abierto."
    },
    "read more": {
        "en": "Read more",
        "es": "Leer más"
    }
}

- URL: index.html?lang=en → This project is open-source. [Read more]

- URL: index.html?lang=es → Este proyecto es de código abierto. [Leer más]

<p><text id="notFound" src="lookup.json" alt="Backup text"></p>

⚠️ Missing text for id="notFound" and lang="fr"

Backup text

<title src="lookup.json"></title>

{
    "title": {
        "en": "Title",
        "es": "Título"
    },
}

- URL: index.html?lang=en → Title in the tab's title

- URL: index.html?lang=es → Título in the tab's title