用原生JavaScript实现jQuery的$.getJSON的解决方法

使用原生JavaScript实现jQuery的$.getJSON需要了解Ajax技术和JSON格式数据的处理。下面是实现该功能的完整攻略：

使用原生JavaScript发送Ajax请求获取JSON数据

function getJSON(url, successCallback, errorCallback) {
  const xhr = new XMLHttpRequest();
  xhr.open('GET', url, true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) {
      if (xhr.status === 200) {
        const data = JSON.parse(xhr.responseText);
        successCallback(data);
      } else {
        errorCallback(xhr.status);
      }
    }
  };
  xhr.send();
}

以上代码定义了一个getJSON函数，接受三个参数：
- 第一个参数是请求的URL
- 第二个参数是Ajax请求成功后的回调函数。会将解析后的JSON数据作为参数传入该函数中。
- 第三个参数是Ajax请求失败后的回调函数。会将HTTP状态码作为参数传入该函数中。

对JSON数据进行处理

假设我们有一段JSON格式数据作为示例：

{
  "name": "John",
  "age": 30,
  "cars": [
    {
      "name": "Ford",
      "models": ["Fiesta", "Focus", "Mustang"]
    },
    {
      "name": "BMW",
      "models": ["320", "X3", "X5"]
    },
    {
      "name": "Fiat",
      "models": ["500", "Panda"]
    }
  ]
}

我们可以使用如下代码读取JSON格式数据：

getJSON('/example.json', function(data) {
  console.log(data.name); // John
  console.log(data.cars[0].name); // Ford
}, function(status) {
  console.error('Error:', status);
});

getJSON函数将会向服务器请求example.json文件，而successCallback则会使用解析后的数据打印出name属性和第一个车辆品牌名称。

示例1: 向服务端发送POST请求

function postJSON(url, data, successCallback, errorCallback) {
  const xhr = new XMLHttpRequest();
  xhr.open('POST', url, true);
  xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) {
      if (xhr.status === 200) {
        const responseData = JSON.parse(xhr.responseText);
        successCallback(responseData);
      } else {
        errorCallback(xhr.status);
      }
    }
  };
  xhr.send(JSON.stringify(data));
}

以上代码定义了一个新的postJSON()函数，用于向服务器发送POST请求的JSON格式数据。函数接受四个参数:
- 第一个参数是请求的URL
- 第二个参数是待发送的数据，必须是JavaScript对象格式
- 第三个参数是Ajax请求成功后的回调函数。会将解析后的JSON数据作为参数传入该函数中。
- 第四个参数是Ajax请求失败后的回调函数。会将HTTP状态码作为参数传入该函数中。

示例2: 修改节点内容

<div id="data"></div>

const url = '/example.json';
const dataElement = document.querySelector('#data');
getJSON(url, function(data) {
  const html = `
    <h2>${data.name}</h2>
    <h3>Cars:</h3>
    <ul>
      ${data.cars.map(car => `
        <li>
          <span>${car.name}</span>
          <ul>
            ${car.models.map(model => `
              <li>${model}</li>
            `).join('')}
          </ul>
        </li>
      `).join('')}
    </ul>
  `;
  dataElement.innerHTML = html;
}, function(status) {
  dataElement.innerHTML = `Error: ${status}`;
});

以上代码获取了example.json文件并生成一个包含数据的HTML代码。其中名称和车辆信息将被填充到 #data 元素的内部HTML中。

总结

使用原生JavaScript实现jQuery的$.getJSON，需要掌握Ajax和处理Json格式数据的相关技术。以上是实现方式的完整攻略，包括Ajax请求和JSON处理，还需要熟悉传递参数和回调函数以及如何动态填充数据到页面的方法。