jQuery operates DOM to get the value of form control

jQuery operates DOM to get the value of form control_jquery

WBOY

Release： 2016-05-16 16:18:22

Original

1157 people have browsed it

The example in this article describes how jQuery operates the DOM to obtain the value of the form control. Share it with everyone for your reference. The specific analysis is as follows:

The biggest difference between HTML attributes and DOM attributes is probably the value of the form control. For example, the value attribute of the text input box in the DOM is called defaultValue, and there is no value attribute in the DOM. As for the option list (select) element, the value of its option is usually obtained through the selectedIndex attribute in the DOM, or through the selected attribute of its option element.

Due to these differences, it is best not to use the .attr() method when getting and setting the value of a form control. As for the option list, it is best not to even use the .prop() method. So what to use? It is recommended to use the .val() method provided by jQuery:

Copy code The code is as follows:

//Get the current value of the text input box

var inputValue = $('#my-input').val();

//Get the current value of the option list

var selectValue = $('#my-select').val();

8. Set the value of the radio list

$('#my-single-select').val('value3');

/^Set the value of the multi-select list

$('#my-multi-select').val(['value1', 'value2']);

Like .attr() and .prop(), the .val() method can also accept a function as its setter parameter. With this versatile .val() method, you will feel more efficient when using jQuery for web development.

I hope this article will be helpful to everyone’s jQuery programming.