2012-04-30 2 views
0

으로 태그 요소의 ID를 설정하라는 다음 IDS는 '2, 4 요소가 쉽게인지 내가 JQuery와 나 자바 스크립트 (재설정 할 수있는 방법을 제거했다다음 HTML 주어 JQuery와

<div> 
    <div id="element-0"></div> 
    <div id="element-1"></div> 
    <div id="element-2"></div> 
    <input id="element-3"></input> 
    <div id="element-4"></div> 
    <div id="element-5"></div> 
    <div id="element-6"></div> 
</div> 

경우) 최종 결과가있는이 모든 광고 문안의 ID :

<div> 
    <div id="element-0"></div> 
    <div id="element-1"></div> 
    <input id="element-2"></div> 
    <div id="element-3"></div> 
    <div id="element-4"></div> 
</div> 

도움 주셔서 감사합니다.

+2

이것은 나쁜 디자인의 냄새를 풍깁니다. 코드에서 숫자 오름차순을 기대해서는 안됩니다. 아마도 코드가 수행 할 작업에 대해 더 자세히 설명 할 수 있다면 더 나은 대안을 제안 할 수 있습니다. – Tejs

답변

1

다른 답변은 좋아하지만, 충분히 강력하지 않을 수 있습니다. 예를 들어 @ Xander의 대답은 요소 중 하나가 input이 아니고 div이 아니라는 점을 고려하지 않았습니다. @ thecodeparadox의 답변은 "element-"ID를 가진 동봉 된 div의 모든 아동에 의존합니다.

이렇게하려면 DOM의 모든 요소를 ​​살펴보고 ID가 "element-"로 시작하는지 확인한 다음 이에 따라 ID를 변경해야합니다. 당신은 여기 내 jsfiddle을 볼 수 있습니다

function reorderIds() { 
    var idx = 0; 
    getElements().each(function() { 
    $(this).attr('id', 'element-' + idx++); 
    }); 
} 

:

function getElements() { 
    return $('html').find('*').filter(function() { 
    var id = $(this).attr('id'); 
    return id && id.indexOf("element-") == 0; 
    }); 
} 

그런 다음 함수가 ID를 다시 정렬 :

나는 "엘리먼트 -"로 시작하는 모든 요소를 ​​얻을 수있는 기능을 쓰기 시작 : http://jsfiddle.net/22CzQ/4/

+0

감사합니다 제대로 작동합니다! –

1
function resetIndexes() { 
    var els = $('div *'), i; 

    for(i = 0; i < els.length; i++){ 
     els.eq(i).attr('id', 'element-' + i); 
    } 
} 
0
<div id="elements"> 
    <div id="element-0"></div> 
    <div id="element-1"></div> 
    <div id="element-2"></div> 
    <input id="element-3"></div> // your markup has error here remove the </div> 
    <div id="element-4"></div> 
    <div id="element-5"></div> 
    <div id="element-6"></div> 
</div> 


$('#elements').children().each(function(index, val) { 
    $(this).attr('id', 'element-' + index); 
});