Advanced jquery Expert Tips for Developers

Today, We want to share with you Advanced jquery Expert Tips for Developers.In this post we will show you Best jQuery Tutorials to help you master it in just few hours, hear for Advanced PHP Tips That Only Expert PHP Developers Know we will give you demo and example for implement.In this post, we will learn about advanced jquery tips and tricks for developers designers with an example.

Advanced jquery Expert Tips for Developers

There are the Following The simple About jquery ui tips and tricks Full Information With Example and source code.

As I will cover this Post with live Working example to develop jQuery – Learn to Code Advanced HTML & CSS, so the Top 10 jquery Tips And Tricks For Beginners is used for this example is following below.

jQuery/JavaScript Part

we will simply include jquery CDN file. as well as We added some custom jQuery or pure JavaScript Source code.

use the functions based on above Example.
1. Performing some scripts after the DOM is ready.

$( document ).ready(function() {
console.log( "I am ready!" );
});

$(function(){
console.log( "I am ready!" );
});

2. How to get a value of text box or select combo box using the ID or class


$("#intxtNm").val();
$(".intxtNm").val();

$("#dspPlan").val();
$(".dspPlan").val();

3. How to add and remove a css class.


$("#elemenData").removeClass("elementclsNm");

$("#elemenData").addClass("elementclsNm");

4. How to check if a checkbox is checked.

$("#selectedAgree").is(":checked");

5. How to check if an object is visible.


$("#elemenData").is(":visible");

6. How to check if an object exists.


if($("#myObject").length > 0){
}

7. How to set an attribute to a html object.


$("#myID").attr("data-id", "1");

8. How to set a specific style to an object.


$("#myID").css("height", "100px");

9. How to hide or show an object.


$("#myID").show();

$("#myID").hide();

10. How to get an object based on partial id.


$("[id*=myID");

$("[id$=myID");

11. How to empty items in select combo box and append new items.


$("#dspPlan").empty();

$("#dspPlan").append("Silver");

12. How to bind and unbind an event to a button.


$("#saveBtnData").on("click", function(event){});
$("#saveBtnData").click(function(event){});

$("#saveBtnData").off("click");
$("#saveBtnData").unbind("click");

13. How to get a href link value using attr keyword.


$("#myLink").attr("href");

14. How to disable or enable a html input button or text box.


$("#btnInfo").attr("disabled", true);
$("#intxtNm").attr("disabled", true);

$("#btnInfo").attr("disabled", false);
$("#intxtNm").attr("disabled", false);

15. Getting on input text only from a html DOM.


$("input [type=text]");

16. Attach multiple events to a button.


$("#saveBtnData").bind("blur keypress", function (event){
});

17. Check if a li tag contains specific word and hide it.


$("li:contains('my word')).hide();

18. For loop of JSON object in JQuery.


var obj = { banana: 1, mobile: 2, tv: 3, laptop: 4, dasktop: 5 };
jQuery.each( arr, function( i, val ) {
console.log(val);
});

19. Avoiding conflict with other script libraries that use JQuery.


var $jq = jQuery.noConflict();
$jq(document).ready(function(){

});

20. Change the background color for even and odd position only for ul li list.


$("li").filter( ":even" ).css("background-color", "green");

$("li").filter( ":odd" ).css("background-color", "red");

21. Remove an element of DOM.


$( "div.align" ).remove();
Web Programming Tutorials Example with Demo

Read :

Summary

You can also read about AngularJS, ASP.NET, VueJs, PHP.

I hope you get an idea about Become a jquery expert in just 10 minutes.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

Leave a Comment