new 방법으로img 대상과document을 생성합니다.createElement 방법으로 img 대상의 차이점을 만듭니다

나는 두 가지 방법으로img대상을 생성하는데 첫 번째 방법은new방법이고 두 번째 방법은document이다.createElement 메서드

var img1 = new Image();
var img2 = document.createElement('img');

사실 언뜻 보기에는 느낌이 좀 다르지만 구체적으로 무엇이 다른지 단번에 말할 수 없다.
console 창에서 비교해 보면 모두img 생성 대상이고 노드 이름은 똑같습니다.
다음은 제가 그것들의 node 유형을 비교해 보겠습니다.
결과적으로 nodeType도 마찬가지로 원소 노드에 속한다.
노드 유형은 원소 노드 Node의 세 가지로 자주 사용된다.ELEMENT_NODE(1);속성 노드 Node.ATTRIBUTE_NODE(2)와 텍스트 노드 Node.TEXT_NODE(3).
유형과 명칭을 보면 이 두 가지 방법으로 만들어진img 노드는 다를 것이 없다.
마지막으로 효율을 비교해 봅시다.각각 10만 번을 연산하다.

	var time1= new Date() - 0;
        for(var i = 0; i < 100000; i++) {
            var img1 = new Image();
        }
        var time2 = new Date() - 0;
        console.log('the first time is ' + (time2 - time1));


        var time3= new Date() - 0;
        for(var i = 0; i < 100000; i++) {
            var img1 = document.createElement('img'); 
        }
        var time4 = new Date() - 0;
        console.log('the second time is ' + (time4 - time3));

결론은 문서입니다.createElement () 방법의 효율이 더 좋습니다!
그럼 100만 번 계산할까요?좀 엉뚱한데, new Image() 방법이 한 수 위!
1000번은 문서입니다.CreateElement () 방법이 더 효율적입니다!
1000만 번 했을 때 new Image() 방법이 더 빨랐고, 내가 세수하고 양치질하고 발 담그고 끝났을 때,document.createElement () 방법은 아직 계산이 끝나지 않았는데, 나중에 바로 붕괴되었다.
따라서 생성 대상의 개수가 적을 때document을 사용합니다.createElement () 가 더 좋은 것 같습니다!
전재 대상:https://www.cnblogs.com/hutaoer/archive/2012/10/22/3078887.html