jQuery로 중첩 된 요소의 ID를 변경하는 방법

Question

DOM을 거쳐 모든 입력 태그의 ID에 접두어를 추가하는 재귀 코드가 있습니다.

내가 더 우아한 jQuery를로 변경하고 싶습니다,하지만 난 선택기는 재귀해야하는 경우 선택기를 구성하거나하는 방법을 잘 모르겠어요 ..

환호,

function set_inputs(obj, prefix){ 
    for (var s=0;s< obj.childNodes.length; s++){ 
    var node = obj.childNodes[s]; 
    if(node.tagName == "INPUT"){ 
     node.id= prefix +'_' + node.id; 
     node.name= prefix +'_' + node.name; 
    } 
    else{ 
     set_inputs(node,prefix); 
    } 
    } 
} 

Answer 1

을 제안하고 싶다. 이 솔루션은 재귀 자바 스크립트보다 훨씬 간단한 코드입니다. 프로덕션 코드에 대해 수행해야하는 ID 및 이름 특성의 존재를 확인하는 단계를 생략했습니다.

$(obj).find("input").each(function(){ 
    $(this).attr('id',prefix + "_" + $(this).attr('id')); 
    $(this).attr('name',prefix + "_" + $(this).attr('name')); 
    }); 

Answer 2

전체 DOM의 경우. 다른 요소를 대상으로 다른 selector에 모든 DOMS 입력을 선택 - $("input") : 당신은 선택을 바꿀 수

var prefix; 
$("input").each(function(i,elem) 
{ 
$(elem).attr("id", prefix + "_" + $(elem).attr("id")); 
}); 

:로

그것은 간단하다.

는 경우는 함수에 별도로 원 :

function() set_inputs(col, prefix) { 
col.each(function(i,elem) 
{ 
    $(elem).attr("id", prefix + "_" + $(elem).attr("id")); 
}); 
} 

당신은 다음과 같이 사용합니다 :

set_inputs($("input"), "abc");//prefix ALL the DOM's inputs with abc 
set_inputs($("input.btn"), "abc");//prefix inputs with the css-class btn 

Answer 3

특별한 필요 하나 이에 대한 jQuery를 사용하지 수 있습니다.

function set_inputs(obj, prefix) { 
    var nodes = obj.getElementsByTagName("input"); 
    for (var i = 0, len = nodes.length; i < len; i++) { 
     if (nodes[i].id) { 
      nodes[i].id = prefix + '_' + nodes[i].id; 
     } 
     if (nodes[i].name) { 
      nodes[i].name = prefix + '_' + nodes[i].name; 
     } 
    } 
} 

추신 : 그것은 재귀이 같은 getElementsByTagName()를 사용하지 않고 일반 자바 스크립트에서 수행 할 수 코드에 ID 나 이름 속성이없는 입력 태그가있는 경우에 대비하여 코드에 보호 기능을 추가 했으므로 코드에서 오류가 발생하지 않도록합니다. 당신은 그것을 두 개의 인수, 원하는 DOM 트리의 부분의 상단을 나타내는 DOM 객체를 전달하여이 함수를 호출

function set_inputs(obj, prefix) { 
    var nodes = obj.getElementsByTagName("input"); 
    for (var i = 0, len = nodes.length; i < len; i++) { 
     nodes[i].id = prefix + '_' + nodes[i].id; 
     nodes[i].name = prefix + '_' + nodes[i].name; 
    } 
} 

: 당신이 보호하지 않은 경우, 코드는 다음과 같이 짧은 것 input 태그를 검색하고 ID에 추가하려는 접두어를 찾으십시오. 다음과 같이하면 : set_inputs(document.body, "test") 전체 문서를 검색합니다. 다음과 같이하면 : set_inputs(document.getElementById("top"), "test"), DOM 트리의 일부 (id = top 요소 아래의 부분) 만 검색합니다. 임의의 DOM 객체에 전달할 수 있으며 해당 계층의 노드 만 검색합니다.

Answer 4

그냥()를 사용 JQuery와 발견을 깊은 중첩 된 입력을 풀려면 작은 변화

$('input').each(function(){ 
    this.id = prefix + this.id; 
});