Learn free jquery tutorials

How to check element is visible or not in JQuery?

January 3, 2023 ·  2 min read

It is a short tutorial on Checking whether a div is visible or not in Jquery. In Html elements can be shown or hidden using below three approaches. display -block/none visibility - hidden/none opacity - 0 to 1 For example, <div class="element1">element1</div> <div class="element2">element2</div> <div class="element3">element3</div> It results in three divs displayed to the browser. as like element1 element2 element3 Let’s make some style changes using display and visibility to hide element1 and element2...

How to Find checkbox is selected or not JQuery?

January 3, 2023 ·  3 min read

This tutorial explains about Jquery Checkbox selects or not with examples. One way is, Find the checkbox checked or not using the is() function. Second way, : checked attribute in jQuery, and in plain JavaScript. This is a short tutorial on to check checkbox checked with different jQuery versions. In HTML, the checkbox displays using the HTML input tag as follows <div> Country <input type="checkbox" name="india" checked id="india" class="checkboxStyle"> India <input type="checkbox" name="usa" id="usa" class="checkboxStyle"> USA </div> The HTML checkbox displays to select many values....

Different ways to get radio button selected value in javascript and JQuery

February 28, 2022 ·  3 min read

This tutorial shows multiple ways to get selected values from a radio button in HTML and CSS. The radio button is a UI element uses on Forms to select one value from a list of buttons. It is one way to display the data in the button to get one value from multiple values. Let’s create a radio button in HTML. A radio button is created using an input tag with type=radio....

How to get the data-id attribute in jquery and javascript?

February 28, 2022 ·  2 min read

This tutorial shows the way to get data attribute values in Javascript and jquery with examples. data-attributes are used to store the custom data to an HTML element. It can be applied to any valid HTML element including div, span, input, and buttons. data attributes are defined with valid syntax. <element data-{validstring}=value> validstring is a small case string, the “currentAge” string is not valid currentage is valid. value can be any number or string....

How to refresh a current page in JQuery?| javascript refresh a page example

February 28, 2022 ·  2 min read

Sometimes, We need to manually reload a web page from a javascript. Since jquery is a javascript framework. It can do easily from this. Reloading or refreshing a page involves retrieving data and asserts from either from cache or server. Asserts are javascript, HTML, and style from a server. There are two types of reloading a current page. Cache refresh: reloading a current page to get the data from a cache hard refresh: reload page retrieves the data from a server Javascript to reload a web page In javascript, you can refresh the page using the below lines of code...

How to use javascript variables, JQuery selector?

February 28, 2022 ·  2 min read

These tutorials show multiple ways to use javascript variables in the Jquery selector. Jquery selectors are used to selecting an element from a DOM tree using element, id, and class selectors. Let’s declare div with id and class attribute <div id="headingId" class="heading">Text example</div> You can change the content inside using javascript $("#headingId").innerHTML = "Div Example"; The above div is selected with the id string. Can we pass a variable as selectors in JQuery?...