What are the use of .val() function in JQuery? how to get the and set value in innerHTML.

Asked 28-Jul-2021
Viewed 231 times

0

What are the use of .val() function in JQuery? how to get the and set value in innerHTML.


1 Answer


1

 Val() in jquery are used to get and set value in selected elements. this val function are mostly used for getting value from input, select tag

Syntax

$(selector).val()
 Return value from selected elements
$(selector).val(value)
 It used to set value in selected elements
$(selector).val(function(index,currentvalue))
 It used to set value in selected elements by using the function
<!DOCTYPE html>

<html lang='en'>
<head>
    <meta charset='utf-8'>
    <title>val demo</title>
    <style>
        select {
            width:150px;
            height:20px;
        }
    </style>
    <script src='https://code.jquery.com/jquery-1.10.2.js'></script>
</head>
<body>
    <p style='color:white;'></p>
    <select id='color'>
        <option>Select Color</option>
        <option>Red</option>
        <option>Blue</option>
        <option>Black</option>
        <option>Pink</option>
        <option>Yellow</option>
        <option>Cyan</option>
    </select>
    <script>
        function displayVals() {
            var colorName = $('#color').val();
            $('p').text(colorName);
            $('body').css({ 'background-color': colorName.toLowerCase() });
        }
        $('select').change(displayVals);
    </script>
</body>
</html>

What are the use of .val() function in JQuery? how to get the and set value in innerHTML.