동적으로 HTML 요소를 변경하고 자바 스크립트로 속성을 복사하는 방법

Question

javascript로 렌더링 할 때 html의 구조/구조를 어떻게 바꿀 수 있습니까? 상위 div를 제거하고 그것의 속성과 클래스 이름 을 자식 요소에 복사하고 싶습니다. 하지만 특정 클래스 이름을 포함하는 전체 페이지에서이 작업을 수행하려고합니다. 코드 예제에서

:

이

<div class="someblock" class="abc" myid="123" position="2"> 
<p>Some paragraph</p> 
<img width="140px; height: 140px; class="myimg" src="url to imgage" /> 
</div> 

이 사람이이, 또는 jQuery를 자바 스크립트와 함께 할 수있는 방법을 알고 있나요 :이 코드

<div class="abc" myid="123" position="2"> 
<div class="someblock"> 
    <p>Some paragraph</p> 
    <img width="140px; height: 140px; class="myimg" src="url to imgage"> 
</div> 

로 변경해야합니까? 미리 감사드립니다.,

Chris.

Answer 1

var el = document.getElementById('123'); 
    if(el) { 
    el.className += el.className ? ' someblock' : 'abc'; 
    } 

Answer 2

$('.abc .someblock').contents().unwrap().parent().addClass('someblock'); 

데모 --->http://jsfiddle.net/VQRQV/1/

Answer 3

당신이 시도 할 수 :

<script> 

    $('.abc').each(function(){ 
     $(this).children().addClass($(this).attr('class')); 
     $(this).children().attr('myid', $(this).attr('myid')); 
     $(this).children().attr('position', $(this).attr('position')); 
     $('body').append($(this).html()); 

     $(this).remove(); 

    }); 

</script> 

하는 것은주의해야합니다.

Answer 4

$('.someblock').each(function() { 
    var pt = $(this).parent(), 
     cl = pt.attr('class'), 
     id = pt.attr('id'), 
     pos = pt.attr('position'); 
    $(this).unwrap().attr({id:id, position:pos}).addClass(cl); 
}); 

Answer 5

당신은 VAR allElem = document.getElementById를 ("*")와 같은 모든 요소를 ​​얻어서 먼저이 작업을 수행 할 수 있습니다; 그런 다음 모든 요소를 ​​반복합니다.

는 요소가 아이들이 마지막 자식과의 get 속성 값의 예를 찾을 수 있는지 여부를 확인 자식 요소로 활용하려면 다음

VAR elemVal = allElem [I] .ClassName과를; 또는 allElem [i] .getAttribute ("xyx")

이 요소의 값을 html의 원하는 요소에 넣습니다.

document.getElementById ("div"). className = elemVal;

Answer 6

이 같은 것이 도움이 될 수 있음 :

function deleteParent(id){ 
    var element = document.getElementById(id); 
    var parent = element.parentNode; 
    var grandParent = parent.parentNode; 
    var html = parent.innerHTML; 
    grandParent.removeChild(parent); 
    grandParent.innerHTML += html; 
}