Fix(DivIcon): revert #5517 to avoid appending a single node instead of generating content (#5574)

* Docs(Marker): explain checks for re-using icon element

when the marker is modified with an icon of the same type (i.e. an image icon with an image icon, or a DivIcon with a DivIcon), or checks for NOT re-using the icon element when modifying with an icon of a different type (i.e. an image icon with a DivIcon, or the reverse).

* Revert "Div icon accept node element as option (#5517)"

This reverts commit ba7bfb5011.

Conflicts:
	spec/suites/layer/marker/MarkerSpec.js

spec/suites/layer/marker/MarkerSpec.js

@@ -73,7 +73,7 @@ describe("Marker", function () {
 			expect(icon.style.height).to.be(expectedXY + 'px');
 		});
 
-		it("changes the icon to another image", function () {
+		it("changes the icon to another image while re-using the IMG element", function () {
 			var marker = new L.Marker([0, 0], {icon: icon1});
 			map.addLayer(marker);
 
@@ -81,7 +81,7 @@ describe("Marker", function () {
 			marker.setIcon(icon2);
 			var afterIcon = marker._icon;
 
-			expect(beforeIcon).to.be(afterIcon);
+			expect(beforeIcon).to.be(afterIcon); // Check that the <IMG> element is re-used
 			expect(afterIcon.src).to.contain(icon2._getIconUrl('icon'));
 		});
 
@@ -122,21 +122,7 @@ describe("Marker", function () {
 			expect(marker.dragging.enabled()).to.be(true);
 		});
 
-		it("changes the icon to another DivIcon which is a DOM element", function () {
-			var marker = new L.Marker([0, 0], {icon: new L.DivIcon({html: 'Inner1Text'})});
-			var customElement = document.createElement('p');
-			customElement.innerHTML = 'InnerTextFromCustomNode';
-			map.addLayer(marker);
-
-			var beforeIcon = marker._icon;
-			marker.setIcon(new L.DivIcon({html: customElement}));
-			var afterIcon = marker._icon;
-
-			expect(beforeIcon).to.be(afterIcon);
-			expect(afterIcon.innerHTML).to.contain('<p>InnerTextFromCustomNode</p>');
-		});
-
-		it("changes the icon to another DivIcon", function () {
+		it("changes the DivIcon to another DivIcon, while re-using the DIV element", function () {
 			var marker = new L.Marker([0, 0], {icon: new L.DivIcon({html: 'Inner1Text'})});
 			map.addLayer(marker);
 
@@ -144,7 +130,7 @@ describe("Marker", function () {
 			marker.setIcon(new L.DivIcon({html: 'Inner2Text'}));
 			var afterIcon = marker._icon;
 
-			expect(beforeIcon).to.be(afterIcon);
+			expect(beforeIcon).to.be(afterIcon); // Check that the <DIV> element is re-used
 			expect(afterIcon.innerHTML).to.contain('Inner2Text');
 		});
 
@@ -165,7 +151,7 @@ describe("Marker", function () {
 
 			marker.setIcon(icon1);
 
-			expect(oldIcon).to.not.be(marker._icon);
+			expect(oldIcon).to.not.be(marker._icon); // Check that the _icon is NOT re-used
 			expect(oldIcon.parentNode).to.be(null);
 
 			if (L.Browser.retina) {
@@ -183,7 +169,7 @@ describe("Marker", function () {
 
 			marker.setIcon(new L.DivIcon({html: 'Inner1Text'}));
 
-			expect(oldIcon).to.not.be(marker._icon);
+			expect(oldIcon).to.not.be(marker._icon); // Check that the _icon is NOT re-used
 			expect(oldIcon.parentNode).to.be(null);
 
 			expect(marker._icon.innerHTML).to.contain('Inner1Text');

src/layer/marker/DivIcon.js

@@ -29,7 +29,7 @@ export var DivIcon = Icon.extend({
 		// iconAnchor: (Point),
 		// popupAnchor: (Point),
 
-		// @option html: String|HTMLElement = ''
+		// @option html: String = ''
 		// Custom HTML code to put inside the div element, empty by default.
 		html: false,
 
@@ -44,13 +44,7 @@ export var DivIcon = Icon.extend({
 		var div = (oldIcon && oldIcon.tagName === 'DIV') ? oldIcon : document.createElement('div'),
 		    options = this.options;
 
-		if (options.html === false) {
-			div.innerHTML = '';
-		} else if (typeof options.html === 'object' && options.html.nodeType === 1) {
-			div.appendChild(options.html);
-		} else {
-			div.innerHTML = options.html;
-		}
+		div.innerHTML = options.html !== false ? options.html : '';
 
 		if (options.bgPos) {
 			var bgPos = point(options.bgPos);