Jquery or Javascript: which is faster and more fit in this scenario
javascript, jquery
Solution
Javascript is obviously much faster than jQuery. As everytime you use jQuery on an element, you are calling the $ function, it will take some time (not noticable).
In your simple case Javascript is more suitable, But in a complex scenario jQuery is more helpfull, as it supports lot of features and most importantly resolves cross browser issues.
Find more Info from below sources:
- jquery vs javascript
- jquery vs raw javascript dom forms
If you want to improve jQuery performance, please go through below sources:
- jQuery optimize selectors
- efficient jQuery selectors
Problem
I have this button ``` <input type="image" src="img/btn2.png" onClick="clearbtn()"> ``` and it calls this function once the image is clicked ``` function clearbtn() { document.getElementById("address").value = "Input Address Here"; document.getElementById("res").value = "Results will be displayed here"; document.getElementById("valid").value = ""; document.getElementById("valid2").value = ""; document.getElementById("cor").value = "Changes will be displayed here"; document.getElementById("code").value = ""; document.getElementById("placeholderImg").style.display = 'none'; document.getElementById("street_number").value = ""; document.getElementById("route").value = ""; document.getElementById("locality").value = ""; document.getElementById("administrative_area_level_1").value = ""; document.getElementById("country").value = ""; document.getElementById("postal_code").value = ""; map.setCenter(defaultLatLng); map.setZoom(0); marker.setMap(null); } ``` My question is which is more faster and more suited for this task the one above or the one below? both of them works but my curiosity strikes as to whether which one gives the optimum/best performance for the said task. ``` function clearbtn() { $('#address').val("Input Address Here"); $('#res').val("Results will be displayed here"); $('#valid').val(""); $('#valid2').val(""); $('#cor').val("Input Address Here"); $('#code').val("Input Address Here"); document.getElementById("placeholderImg").style.display = 'none'; $('#street_number').val("Input Address Here"); } ```