요소가 자체 변수를 소유하게 만드시겠습니까?

달을 나열하는 함수를 만들었습니다.요소가 자체 변수를 소유하게 만드시겠습니까?

function genDate() { 
     var d = new Date(); 

     var monthNames = [ "JAN", "FEB", "MAR", "APR", "MAY", "JUN", 
     "JUL", "AUG", "SEP", "OCT", "NOV", "DEC" ]; 

     var day = d.getUTCDate().toString(); 
     var mon = d.getUTCMonth(); 
     var year = d.getUTCFullYear(); 

     $("#day").prepend('<span id="day_num">' + day + '</span>'); 

     var cc = mon; 
     for (var i = 0; i < 12; i++) { 
      $("#date_cont").append('<div class="month"><a href="" 
        onclick="return false;" >' + monthNames[cc] + '</a></div>'); 

      cc++; 

      if (cc > 11) { 
       cc = 0; 
      } 
     } 
    }

는 내가 뭘 원하는 생성 .months 요소는 다른 기능에서 사용할 수있는 자사의 달 지수 (0-11)과 같은 다른 변수를 유지해야합니다. 요소가 객체로 작동 할 것입니다 (.month 클래스의 각 요소는 고유 한 값을가집니다). 나는 이것을 구현하는 방법을 모르기 때문에 자바 스크립트에 익숙하지 않다.

출처

2013-05-28 Mushy

확실히 데이터 속성에 추가하고 나중에 가져 오시겠습니까?

$('.month').on('click', function(e) { 
    e.preventDefault(); 
    var idx = $(this).data('month'), 
     month = monthNames[idx]; 

    alert(month); 
});

FIDDLE

출처

2013-05-28 22:16:19 adeneo

고마워요. 이건 정말 도움이됩니다. 질문 : 왜 e.preventDefault()를 포함 시켰습니까? – Mushy

@Andy - 앵커를 클릭하면 좋은 습관입니다. 앵커에는 빈 href가 없어야하므로 일반적으로 해시가 사용되지만 클릭하면 페이지가 맨 위로 스크롤되고 preventDefault는 앵커를 클릭 할 때 그 또는 다른 기본 동작을 방지합니다. 마지막 비트는 요소에서 데이터 속성을 얻는 방법의 예에 불과합니다. – adeneo

@adeneo'href = "javascript :;"'에'href'를 설정할 수 있습니다. 어떤 이유로 든 앵커 태그를 유지해야한다면'href = "#"'문제를 피할 수 있습니다. –

당신이 요소가 있다면 당신은 ... jQuery를 사용하고 있기 때문에 ...

var elem = $('<div></div>'); 
elem.data('day', someValue); //sets 'day' to someValue's value 
elem.click(function(e){ 
    var d = $(this).data('day'); 
});

참고 : 당신은 당신이 원하는대로 속성 DOM 요소에 (충돌하지 않으려 고) 할당 할 수 있습니다.

var elem = document.getElementById("mine"); 
elem.somePropertyName = someValue;

또한 data- * 속성은 이것을 마크 업으로 푸시하는 데 적절한 방법으로 간주됩니다.

$('#elem').attr('data-day', someValue); 
or 
<div id="elem" data-day="someValue">...</div>

출처

2013-05-28 22:15:25 Tracker1

감사합니다 :

for (var i = 0; i < 12; i++) { var a = $('<a />', {href: '#', text: monthNames[i] }), div = $('<div />', {'class': 'month', 'data-month': i }); // ^^^^^ add a data attribute ! $("#date_cont").append(div.append(a)); }

이후 당신은 같은 것을 할 수있다! 빠른 질문, getElementById는 어떤 유형을 반환합니까? – Mushy

ID를 기반으로 실제 DOM 요소를 반환하거나 정의되지 않았습니다 ... – Tracker1

요소가 자체 변수를 소유하게 만드시겠습니까?

답변

관련 문제