TypeError: $.getJSON is not a function in jQuery, a common error you often get when working with jQuery functions. Our explanations below will help you solve this kind of error with causes and solutions.
What causes the TypeError: $.getJSON is not a function in jQuery?
In fact, getJSON() is a method which is included in many jQuery libraries. This method helps you load the JSON-encoded data from the server via a HTTP GET request. The TypeError: $.getJSON is raised implies that this method getJSON() is not found in the jQuery version that you have imported, it might be due to you have used the old versions or jQuery slim versions in the HTML file. For instance:
<html>
<body>
<h1>LearnShareIT</h1>
<script src ="https://code.jquery.com/jquery-3.3.1.slim.min.js">
// Import the slim version
</script>
<script type ="text/javascript">
$.getJSON('https://learnshareit.com/api')
</script>
</body>
</html>Result:
Have you acknowledged the cause of the error? It’s because of the version of jQuery you have used, which in the above example is: 3.3.1.slim.min.js. It is a jQuery slim version so it does not include the getJSON method or many ajax functions.
To solve the error, we recommend you use a slim version or a full one or use a newer version of jQuery. Follow the next section to see how to solve this problem.
How to fix this error?
Use the jQuery full version
You should remember that this function getJSON() only works if you are using a full version or min version of jQuery but not the slim one. As the slim one excluded this function and some unused ones. Therefore you should use the full jQuery version, for example:
<html>
<body>
<h1>LearnShareIT</h1>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.js">
// Import the full version
</script>
<script type="text/javascript">
$.getJSON('https://randomuser.me/api/', console.log)
</script>
</body>
</html>
Output:
Use the jQuery min version
In the previous explanations, the getJSON() method may not present in jQuery slim versions which you imported. However, it is included in min jQuery versions and also the full jQuery version (as previous). That is the reason why you can use the jQuery min version too:
<html>
<body>
<h1>LearnShareIT</h1>
<script src ="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js">
// Import the min version
</script>
<script type ="text/javascript">
$.getJSON('https://randomuser.me/api/', console.log)
</script>
</body>
</html>
Output
As can be seen, we have imported the jQuery min version as in the above example. To be honest, although there are many versions that include this getJSON function, we suggest you use the newest version instead because it can help you prevent some other errors while using it. Therefore, if you make changes to the version you used, the results can become different from what expected.
Summary
We discussed many ways to fix the TypeError: $.getJSON is not a function in jQuery. We suggest you import only one version of jQuery in your code and make sure it is the newest slim or full version, you can easily solve this problem with our tutorials.
Maybe you are interested:
- How To Solve TypeError: $(…).datepicker Is Not A Function In jQuery?
- Solution To TypeError: $(…).DataTable Is Not A Function Error In JQuery
- TypeError: $(…).animate is not a function in jQuery
I’m Edward Anderson. My current job is as a programmer. I’m majoring in information technology and 5 years of programming expertise. Python, C, C++, Javascript, Java, HTML, CSS, and R are my strong suits. Let me know if you have any questions about these programming languages.
Name of the university: HCMUT
Major: CS
Programming Languages: Python, C, C++, Javascript, Java, HTML, CSS, R
