Как можно использовать JSON в HTML?

Как можно изменить предоставленный PHP-код, который меняет значение в test.json с "off" на "on" и обратно, в код HTML для последующей публикации на репозитории GitHub?
  • 14 апреля 2024 г. 11:39
Ответы на вопрос 2
1. Для использования JSON в HTML можно загрузить JSON данные при помощи JavaScript и отобразить их на странице или использовать JSON для пересылки данных между сервером и клиентом.

Пример загрузки и отображения JSON данных на странице HTML:

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JSON Example</title>
</head>
<body>
    <div id="data"></div>

    <script>
        fetch('data.json')
            .then(response => response.json())
            .then(data => {
                document.getElementById('data').innerText = JSON.stringify(data);
            })
            .catch(error => console.error('Error:', error));
    </script>
</body>
</html>
```

2. Для изменения значения в файле test.json с помощью PHP и последующей публикации на репозитории GitHub, необходимо добавить обработчик формы в HTML, который будет отправлять запрос на сервер для выполнения соответствующих действий.

Пример HTML кода с формой для отправки запроса на сервер:

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Update JSON Value</title>
</head>
<body>
    <form id="updateForm">
        <input type="submit" value="Update Value to On">
    </form>

    <script>
        document.getElementById('updateForm').addEventListener('submit', function(event) {
            event.preventDefault();

            fetch('update.php', {
                method: 'POST',
                body: JSON.stringify({ value: 'on' })
            })
            .then(response => {
                if (response.ok) {
                    alert('Value updated to On');
                } else {
                    alert('Error updating value');
                }
            })
            .catch(error => console.error('Error:', error));
        });
    </script>
</body>
</html>
```

Пример измененного PHP-кода (update.php), который изменяет значение в test.json:

```php
<?php
$jsonFile = 'test.json';

$data = array();
if (file_exists($jsonFile)) {
    $data = json_decode(file_get_contents($jsonFile), true);
}

$data['status'] = ($_POST['value'] == 'on') ? 'on' : 'off';

file_put_contents($jsonFile, json_encode($data));
?>
```

Теперь, при отправке формы на странице HTML, значение в файле test.json будет изменяться с "off" на "on" и обратно. Соответствующие изменения в репозитории GitHub можно будет увидеть после публикации обновленного файла.
HTML - язык разметки , никакие значения он не меняет
Похожие вопросы