Javascript （初学者）如何动态修改json文件

首先，我为我糟糕的英语和肮脏的代码感到抱歉。我试图创建一个基本文件来显示我想做什么

目标：我想创建一个简单的网页，在其中可以修改div的样式并将所有内容保存在json文件中，这样我们就可以在将来打开该文件时检索更改

json文件的内容：

{
  "width": 100,
  "height": 100
}

我设法用PHP读取json文件，并用表单输入对其进行编辑，但每次修改都会刷新页面。这不是很理想

$file=

$json=

$width=

$height=

要在不重新加载页面的情况下应用更改，您需要避免表单提交。使用或将数据发送到服务器，然后服务器将数据保存到JSON文件和/或使用现有的JSON进行响应。要做到这一点，您需要将代码分为两部分——服务器端部分将读取/更新JSON文件，客户端部分将是纯HTML，并在字段更改时将请求发送到服务器。
我建议查看类似jsonnet的内容。这是可编程的JSON，所以你可以做你想做的。谢谢你的回答。我的问题非常基本，jsonnet接缝对于我的情况来说有点复杂。老实说，我不清楚这是什么。。。我在网络开发方面没有太多的知识，我想把自己局限于基本的语言和技术。你有没有一个好的例子可以帮助我理解如何做到这一点？我只从使用jQuery或只阅读json的人那里找到答案。我是一个初学者前端开发人员，服务器端对我来说非常混乱。