.val()【要素値 取得・設定】

<style>
.arrow { font-size:x-large; }
.arrow:before { content:" → " }
</style>

<p><!--<input>-->
  <input id="textFrom" type="text" value="textFrom">
  <span class="arrow"></span>
  <input id="textTo" type="text" value="textTo">
</p>
<p><!--<input type="checkbox" value="～">-->
  <label><input id="checkboxFrom1" type="checkbox" value="CHECKBOX1" checked>checkboxFrom1 (value属性あり)</label>
  <span class="arrow"></span>[<span id="checkboxValue1"></span>]
  <label><input id="checkboxTo1" type="checkbox" value="CHECKBOX1">checkboxTo1</label>
</p>
<p><!--<input type="checkbox">-->
  <label><input id="checkboxFrom2" type="checkbox" checked>checkboxFrom2 (value属性なし)</label>
  <span class="arrow"></span>[<span id="checkboxValue2"></span>]
  <label><input id="checkboxTo2" type="checkbox">checkboxTo2</label>
</p>
<p><!--<input type="radio" name="～" value="～">-->
  <label><input name="radioFrom" type="radio" value="RADIO1" checked>radioFrom (RADIO1)</label>
  <label><input name="radioFrom" type="radio" value="RADIO2">radioFrom (RADIO2)</label>
  <span class="arrow"></span>[<span id="radioValue"></span>]
  <label><input name="radioTo" type="radio" value="RADIO1">radioTo (RADIO1)</label>
  <label><input name="radioTo" type="radio" value="RADIO2" checked>radioTo (RADIO2)</label>
</p>
<p><!--<select size="1">-->
  <select id="selectFrom1" size="1">
    <option value="1" selected>項目1
    <option value="2">項目2
    <option value="3">項目3
  </select>
  <span class="arrow"></span>[<span id="selectValue1"></span>]
  <select id="selectTo1" size="1">
    <option value="1">項目1
    <option value="2" selected>項目2
    <option value="3">項目3
  </select>
</p>
<p><!--<select size="3">-->
  <select id="selectFrom2" size="3">
    <option value="a" selected>項目a
    <option value="b">項目b
    <option value="c">項目c
  </select>
  <span class="arrow"></span>[<span id="selectValue2"></span>]
  <select id="selectTo2" size="3">
    <option value="a">項目a
    <option value="b" selected>項目b
    <option value="c">項目c
  </select>
</p>
<p><!--<select size="3" multiple>-->
  <select id="selectFrom3" size="3" multiple>
    <option value="A" selected>項目A
    <option value="B" selected>項目B
    <option value="C">項目C
  </select>
  <span class="arrow"></span>[<span id="selectValue3"></span>]
  <select id="selectTo3" size="3" multiple>
    <option value="A">項目A
    <option value="B" selected>項目B
    <option value="C" selected>項目C
  </select>
</p>
<p><!--<textarea>-->
  <textarea id="textareaFrom">textareaFrom</textarea>
  <span class="arrow"></span>
  <textarea id="textareaTo">textareaTo</textarea>
</p>

<script>
// <input>
$("#textFrom").change(function() {
  $("#textTo").val( $(this).val() );
});
// <input type="checkbox" value="～">
$("#checkboxFrom1").change(function() {
  var value = $("#checkboxFrom1:checked").val();
  $("#checkboxValue1").text( (value === undefined) ? "undefined" : value );
  $("#checkboxTo1").val( [ value ] );
});
// <input type="checkbox">
$("#checkboxFrom2").change(function() {
  var value = $(this).is(":checked");
  $("#checkboxValue2").text(value);
  $("#checkboxTo2").prop("checked", value);
});
// <input type="radio" name="～" value="～">
$("input[name='radioFrom']").change(function() {
  var value = $("input[name='radioFrom']:checked").val();
  $("#radioValue").text( (value === undefined) ? "undefined" : value );
  $("input[name='radioTo']").val( [ value ] );
});
// <select size="1">
$("#selectFrom1").change(function() {
  var value = $(this).val();
  var text = typeof value + "：" + value;
  $("#selectValue1").text(text);
  $("#selectTo1").val(value);
});
// <select size="3">
$("#selectFrom2").change(function() {
  var value = $(this).val();
  var text = typeof value + "：" + value;
  $("#selectValue2").text(text);
  $("#selectTo2").val(value);
});
// <select size="3" multiple>
$("#selectFrom3").change(function() {
  var value = $(this).val();
  var text = ($.isArray(value)) ? "Array" : "not Array";
  text += " (" + value.length + ")：" + value;
  $("#selectValue3").text(text);
  $("#selectTo3").val(value);
});
// <textarea>
$("#textareaFrom").change(function() {
  $("#textareaTo").val( $("#textareaFrom").val() );
});
</script>

checkboxFrom1 (value属性あり) [] checkboxTo1

checkboxFrom2 (value属性なし) [] checkboxTo2

radioFrom (RADIO1) radioFrom (RADIO2) [] radioTo (RADIO1) radioTo (RADIO2)

項目1項目2項目3 [] 項目1項目2項目3

項目a項目b項目c [] 項目a項目b項目c

項目A項目B項目C [] 項目A項目B項目C

textareaFrom textareaTo

<p>
  <input id="text2" value="aBcDeF">
  <button id="toUpperCase">toUpperCase()</button>
  <button id="toLowerCase">toLowerCase()</button>
</p>

<script>
$("#toUpperCase").click(function() {
  $("#text2").val(function(index, value) {
    return value.toUpperCase();
  });
});
$("#toLowerCase").click(function() {
  $("#text2").val(function(index, value) {
    return value.toLowerCase();
  });
});

toUpperCase()toLowerCase()