반응형

*  li에서 텍스트 추출, 공백제거


$(function(){
    var value1 = '      abc     ';
    var value2 = $(":text").val();
    //공백제거 전
    alert("value1 : " + value1+"\n"+"value2 : " + value2);
     
    value1 = $.trim(value1);
    value2 = $.trim(value2);
    //공백제거 후
    alert("value1 : " + value1+"\n"+"value2 : " + value2);
})

<!doctype html>
<html lang="ko">
 <head>
  <script src="http://code.jquery.com/jquery-latest.min.js"></script>
  <meta http-equiv="Content-Type" content="text/html";charset="utf-8"/>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
	ul{list-style-type: none;}
  </style>
 </head>
 <body>

  <ul id="menu1">
	<li>철수1</li>
	<li>영희1</li>
	<li>길동1</li>
	<li>둘리1</li>
  </ul>

  <ul id="menu2">
	<li>철수2</li>
	<li>영희2</li>
	<li>길동2</li>
	<li>둘리2</li>
  </ul>
  

   <script>	
   $("#menu2 li").each(function( index, element ) {
     console.log($(this).text());
   });
  </script>

 </body>
</html>
반응형
반응형

each()문을 써야하는 이유는 무엇일까 특징을 살펴보자?

1. 일반 for문보다 가독성이 좋다
2. 객체형을 다루기가 쉽다.
3. Array 객체에서 사용가능
4. 빠른편이다.
5. 리턴값을 받지 못한다.

 

for, foreach, each 

var arr= [ 
			{name : '알리송', backnumber : '1'}
          , {name : '반다이크', backnumber : '4'} ];

//for문
for (var i = 0; i <arr.length; i++) {
  console.log('element', i, arr[i]);
  console.log(arr[i].name);
  console.log(arr[i].backnumber);
  console.log(arr[i].name + arr[i].backnumber);
};


foreach문
arr.forEach (function (el, index) {
  console.log('element', index, el);
  console.log(el.name);
  console.log(el.backnumber);
  console.log(el.name + el.backnumber);
});


$.each문
$.Each (arr, function (index, el) {
  console.log('element', index, el);
  console.log(el.name);
  console.log(el.backnumber);
  console.log(el.name + el.backnumber);
});
반응형

+ Recent posts