[javascript] DOM 요소를 첫 번째 자식으로 설정하는 방법은 무엇입니까?
나는 요소 E를 가지고 있으며 그것에 요소를 추가하고 있습니다. 갑자기 다음 요소가 E의 첫 번째 자식이어야한다는 것을 알게되었습니다. 어떻게해야합니까? E는 배열이 아닌 객체이므로 메서드 unshift가 작동하지 않습니다.
트로프 E의 아이들을 반복하고 키 ++로 옮기는 것이 먼 길이지만, 더 예쁜 방법이 있다고 확신합니다.
답변
var eElement; // some E DOM instance
var newFirstElement; //element which should be first in E
eElement.insertBefore(newFirstElement, eElement.firstChild);답변
2017 년판
당신이 사용할 수있는
targetElement.insertAdjacentElement('afterbegin', newFirstElement)에서 MDN :
insertAdjacentElement () 메소드는 호출 된 요소를 기준으로 지정된 위치에 지정된 요소 노드를 삽입합니다.
position
요소와 관련된 위치를 나타내는 DOMString; 다음 문자열 중 하나 여야합니다.
beforebegin: 요소 자체 앞.
afterbegin: 첫 번째 자식 앞에 요소 내부.
beforeend: 마지막 자식 이후 요소 내부.
afterend: 요소 자체 뒤.element
트리에 삽입 할 요소입니다.
또한 가족 계열 insertAdjacent에는 형제 방법이 있습니다.
element.insertAdjacentHTML('afterbegin','htmlText')innerHTML모든 것을 무시하지 않고 html 문자열을 직접 주입 하므로 압제 적 인 과정을 뛰어 넘고 document.createElement문자열 조작 과정으로 전체 구성 요소를 만들 수도 있습니다
element.insertAdjacentText살균 문자열을 element에 주입하십시오. 더 이상은 없어encode/decode
답변
2018 버전
parentElement.prepend(newFirstChild)이것은 현대 JS입니다! 이전 옵션보다 더 읽기 쉽습니다. 현재 Chrome, FF 및 Opera에서 사용할 수 있습니다.
추신 : 당신은 직접 문자열을 선행 할 수 있습니다
parentElement.prepend('This text!')사용 가능 -2020 년 5 월 94 %
답변
모든 창 HTML 요소에서 직접 구현할 수 있습니다.
이처럼 :
HTMLElement.prototype.appendFirst=function(childNode){
if(this.firstChild)this.insertBefore(childNode,this.firstChild);
else this.appendChild(childNode);
};답변
수락 된 답변은 함수로 리팩토링되었습니다.
function prependChild(parentEle, newFirstChildEle) {
parentEle.insertBefore(newFirstChildEle, parentEle.firstChild)
}답변
내가 오해하지 않는 한 :
$("e").prepend("<yourelem>Text</yourelem>");또는
$("<yourelem>Text</yourelem>").prependTo("e");설명에서 어떤 조건이 첨부되어있는 것처럼 들리므로
if (SomeCondition){
$("e").prepend("<yourelem>Text</yourelem>");
}
else{
$("e").append("<yourelem>Text</yourelem>");
}