120

DOM의 요소를 대체하려고합니다. 예를 들어, 대신 "SPAN"으로 대체하려는 "A"요소가 있습니다.Javascript를 사용하여 DOM 요소를 대체하는 방법은 무엇입니까?

어떻게할까요? replaceChild()를 사용하여

2009-05-09 omg

'target.replaceWith (요소),'DOM은 ES와 함께이 사양하는 일이 – Gibolt

@Gibolt을 할 수있는 현대 (ES5 +) 방법은? 게다가 ES5는 9 년 전에 출시되었지만 아직 DOM 표준의 일부는 아닙니다. – destoryer

167

는 :

<html> 
<head> 
</head> 
<body> 
    <div> 
    <a id="myAnchor" href="http://www.stackoverflow.com">StackOverflow</a> 
    </div> 
<script type="text/JavaScript"> 
    var myAnchor = document.getElementById("myAnchor"); 
    var mySpan = document.createElement("span"); 
    mySpan.innerHTML = "replaced anchor!"; 
    myAnchor.parentNode.replaceChild(mySpan, myAnchor); 
</script> 
</body> 
</html>

출처

2009-05-09 17:15:41

이 예제는 작동하지 않습니다. 스크립트 블럭을 작동 시키려면 몸체 끝 부분에 스크립트 블록을 놓아야합니다. 또한, 재미있게하기 위해 : 작업 후에 [alert (myAnchor.innerHTML)] 행을 추가하십시오. – KooiInc

앵커 안의 StackOverflow 맞춤법 실수 TheText – rahul

루트 html 요소 인 경우 – lisak

var a = A.parentNode.replaceChild(document.createElement("span"), A);

A는 a 요소로 대체된다.

출처

2009-05-09 17:20:27 Kamarey

@Bjorn Tipling의 답변은 실제로 작동하지 않습니다. 이것은 KooiInc에 대한 (올바른!) 답변이며, 또한 정확한 설명입니다. 이제 작동합니다! ;-) 둘 다 Tx! –

A.replaceWith (스팬)

일반 양식 : 이전 방법보다 청소기/

target.replaceWith(element);

더 나은 방법. 사용 사례를 들어

A.replaceWith(span);

출처

2016-11-05 23:18:51 Gibolt

+10

IE11 또는 Edge 14에서는 지원되지 않습니다 (현재 : 2016-11-16). – jor

Google의 Closure 또는 다른 transpiler를 사용해 ES5로 변환 해보십시오. – Gibolt

완전히 동의하지만 IE11과 Edge 14는 오래된 것이 아닙니다 ... – jor

Javascript를 사용하여 DOM 요소를 대체하는 방법은 무엇입니까?

답변

A.replaceWith (스팬)

관련 문제