2014-11-11 6 views
0

아래에 표시된 것처럼 클래스 이름이 myClass 인 div가 들어있는 javascript 변수 (예 : myElement)가 있습니다. 어떻게 당신이 할 수있는부모 요소에 속성 추가

<div> 
    <div class="myClass" data-index="index1"> 
     <h1>My Div</h1> 
     <div id="1">Div one Content</div> 
     <h2>Headline two</h2> 
     <div id="2">Div two Content </div> 
    </div> 

    <div class="myClass" data-index="index2"> 
     <h1>My Div</h1> 
     <div id="1">Div one Content</div> 
     <h2>Headline two</h2> 
     <div id="2">Div two Content </div> 
    </div> 
</div> 

을 : 그것은 다음과 같이 할 수 있도록 jascsript 또는 jQuery를 통해 사업부 가진 클래스 'myClass가'(데이터 인덱스 예)

<div> 
    <div class="myClass"> 
     <h1>My Div</h1> 
     <div id="1">Div one Content</div> 
     <h2>Headline two</h2> 
     <div id="2">Div two Content </div> 
    </div> 
    <div class="myClass"> 
     <h1>My Div</h1> 
     <div id="1">Div one Content</div> 
     <h2>Headline two</h2> 
     <div id="2">Div two Content </div> 
    </div> 
</div> 

나는 속성을 추가 할 이걸 달성 할까?

참고 : 나는 myElement라는 자바 스크립트 변수에이 사업부 및

myElement.attr('data-index','index') 

이 작동하지 않는 다음과 같은 코드가 있습니다.

업데이트 :

내가 먼저가 DOM에 변수 myElement에 저장된 사업부를 추가처럼 시도 할 수

는 다음 속성 추가 :

$('div.myClass').attr('data-index','index'); 

을하지만 문제는 내가 같이있는 DOM에 클래스 100과 클래스 myClass.

+2

어떻게'myElement'를 정의를? jQuery 객체입니까? – isherwood

+0

이 문제를 해결하려면 더 많은 jQuery가 필요합니다 (더 많은 코드 plz 표시). –

+0

코드가 표시된대로 작동합니다. http://jsfiddle.net/isherwood/2oLt7hss/1/ – isherwood

답변

0

이 시도 :

var newAttr = document.createAttribute("data-index"); 
newAttr.value = "[What you want the index to be]"; 

// Will set data-index for first .myClass in newElement 
newElement.getElementsByClassName("myClass")[0].setAttributeNode(newAttr); 

// Will set data-index for every .myClass in newElement 
newElement.getElementsByClassName("myClass").map(function(node) { 
    node.setAttributeNode(newAttr) 
}); 
0

잘, 더 좋은 방법은 당신이 HTML을 작성하는 동안 속성을 만드는 것입니다.

그러나 당신은 당신이 JQuery와 반복 처리 기능 (Jquery.each)를 사용하여 원하는 것을 할 수 있습니다 http://api.jquery.com/jquery.each/

var myElements = $('div.myClass'), 
    i = 0; 

$.each(myElements , function(i) { 
    $(this).attr('data-index','index'+(i+1)); 
}); 
관련 문제