작성일 : 11-11-30 13:20
|
[JQuery] (JQuery Source) each , for , get, html
|
 |
|
글쓴이 :
조형래
 조회 : 4,758
|
<script src="../js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
// h3 요소 모두 가져오기
var headers = $('h3');
// 반복문을 써서 반복 : for문보다는 jQuery의 each문이 사용하기 편리
for (var i = 0; i < headers.length; i++) {
alert($(headers[i]).html());
}
// 위 코드를 each문으로 변경?
$('h3').each(function (index) {
alert($(this).html());
});
// html 의 객수 길이만큼 반복
var headers = $('h3').get();
for (var i = 0; i < headers.length; i++) {
alert($(headers[i]).html());
}
//[1] each 메서드 설명
//$('p').each(function (index) { alert(index); });
//[2] for문처럼 반복한다. index는 0부터 자동 증가됨
$('p').each(function (index) {
$(this).attr({ // attr({어트리뷰트:값});
'id': "para-" + index
});
});
//[3] 0번째 요소의 텍스트 읽어오기
$('#btn').click(function () {
alert($('#para-0').text()); // text() : 태그안의 값 : C#
});
var result = "";
// 폼 요소가 있는 만큼 반복하자.
//alert($(':input').size());
$(':input').each(function (index) {
result += "태그명 : " + $(this).get(0).tagName // this.tagName
+ ", type 속성명 : " + $(this).attr('type') + '\n';
});
alert(result);
});
</script>
<h3>제목1</h3>
<h3>제목2</h3>
<p>1. C#</p>
<p>2. ASP.NET</p>
<p>3. Silverlight</p>
<input type="button" id="btn" value="동적으로 생성된 id로 개체 접근" />
<br>
<br>
<br>
<input type="button" value="Input Button"/><br />
<input type="text"/><br />
<input type="password"/><br />
<input type="checkbox"/><br />
<input type="file"/><br />
<input type="hidden"/><br />
<input type="image"/><br />
<input type="radio"/><br />
<input type="reset"/><br />
<input type="submit"/><br />
<select><option>드롭다운리스트</option></select><br />
<textarea>멀티라인텍스트박스</textarea><br />
<button>버튼</button><br />
|
|
990
