2014-05-01 16 views
6

Đây là HTML đơn giản của tôi:Tại sao cuộc gọi đến appendChild của jQuery không thành công với lỗi không xác định?

<body> 
    <div id="myParentDivElement"> 
     Hello World! 
    </div> 
</body> 

Đây là JavaScript kèm theo:

$(document).ready(function() { 
    var myDOMElement = document.getElementById("myParentDivElement"); 

    var newDivID = "div_1"; 
    var newDiv = $('<div id="' + newDivID + '"/>'); 
    $(newDiv).css('marginLeft', '50px'); 

    var newSpanID = "span_1"; 
    var newSpan = $('<span id="' + newSpanID + '"/>'); 
    newSpan.text('myLabel'); 
    newDiv.appendChild(newSpan); 
    $(myDOMElement).appendChild(newDiv); 
}); 

Nhưng khi tôi chạy mã này dòng newDiv.appendChild(newSpan); cung cấp cho các lỗi sau:

Uncaught TypeError: undefined is not a function 

Can ai đó giải thích tại sao? Đây là JSFiddle cho thấy rằng nó không hoạt động: http://jsfiddle.net/TsTMx/2/

+0

Tại sao không chấp nhận một trong những câu trả lời này? –

Trả lời

1

Sử dụng .append()

newDiv.append(newSpan); 

.appendChild() làm việc với phần tử DOM. newDiv là đối tượng jQuery không phải là phần tử JavaScript DOM thuần túy.

Working Fiddle

12

.appendChild() là một đồng bằng JavaScript phương pháp, không jQuery. Phương thức jQuery là .append().

newDiv.append(newSpan); 
$(myDOMElement).append(newDiv); 
+1

'appendChild' là DOM, không phải là JavaScript. – Quentin

+1

Đúng là nó là một phần của DOM nhưng nó là công bằng khi nói rằng nó là một phương thức JavaScript đơn giản trái ngược với một phương thức jQuery. – MrCode

+0

Các phương thức DOM được trình duyệt cung cấp và có xu hướng được viết bằng C/C++/Objective-C, trong khi jQuery được viết bằng JS, trong khi 'append' có thể kết thúc gọi phương thức DOM, nó được viết bằng JS:) – Quentin

Các vấn đề liên quan