<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<meta charset="UTF-8">
<title>Document</title>
<script>
$(function(){
$('#button1').click(
function(){
alert($('#input1').val());
}
);
$('#button2').click(
function(){
$('#input1').val("設置輸入框中的內(nèi)容");
}
);
$('#button3').click(
function(){
$('#single').val("Single2");
$('#multiple').val(["Multiple2","Multiple3"]);
$('input:checkbox').eq(0).attr('checked', 'true');//根據(jù)索引來設置屬性
$('input:checkbox').eq(1).attr('checked', 'true');
$('input:radio').eq(0).attr('checked', 'true');
// $("input").val(["check2", "radio1"]);//這樣會動到所有的input元素,包括輸入框
}
);
$('#button4').click(
function(){
alert($('input').attr("name")); //獲取所有input標簽name屬性
}
);
$('#button5').click(
function(){
$("p").attr({style:"color:red;"});
}
);
$('#button6').click(
function(){
$("#input1").attr("placeholder", function() { return this.name });//這個this代表的是document(dom)對象,而不是jquery對象,所以只能使用document對象的屬性哦
}
);
$('#button7').click(
function(){
alert($('p').html());
}
);
$('#button8').click(
function(){
alert($('p').html("<a href='#'>被改變了</a>"));
}
);
});
</script>
</head>
<body>
<p><b>val屬性</b></p>
<hr>
姓名:
<input id="input1" type="text" name="input2" value="" placeholder="請輸入姓名">
<br>
<button id="button1">獲取輸入框內(nèi)容</button>
<br>
<br>
<button id="button2">設置輸入框內(nèi)容</button>
<br>
<br>
<select id="single">
<option>Single</option>
<option>Single2</option>
</select>
<select id="multiple" multiple="multiple">
<option selected="selected">Multiple</option>
<option>Multiple2</option>
<option selected="selected">Multiple3</option>
</select>
<br/>
<input type="checkbox" name="checkbox" value="check1" /> check1
<input type="checkbox" name="checkbox" value="check2" /> check2
<input type="radio" name="radio" value="radio1" /> radio1
<input type="radio" name="radio" value="radio2" /> radio2
<br><br>
<button id="button3">設置下拉單選/多選,復合選,單選選項的值</button>
<hr>
<p>attr屬性</p>
<hr>
<button id="button4">獲取input標簽屬性</button><br><br>
<button id="button5">給所有p標簽設置屬性</button><br><br>
<button id="button6">設置input標簽屬性</button><br><br>
<hr>
<p>html/text屬性(text區(qū)別在于所有內(nèi)容都被當文本)</p>
<hr>
<button id="button7">獲取p標簽html內(nèi)容</button><br><br>
<button id="button8">設置p標簽html內(nèi)容</button><br><br>
</body>
</html>

Paste_Image.png