Question

我正在构建一个简单的脚本来了解mvc的工作原理。我是新手，想看看有没有人可以帮助我。我无法使用渲染功能来显示模型中的内容。我的控制台出错：

“app.js：33 Uncaught TypeError：无法在'Node'上执行'appendChild'：参数1不是'Node'类型。”

任何有关此的帮助将不胜感激。

var model = {
	farm: {
		cow: "Moo!", 
		pig: "Oink!", 
		duck: "Quack!"
	}
};

var controller = {
	init: function() {
		farmView.init();
	},
	getBarn: function() {
		return model.farm;
	}
};

	
var farmView = {
		
		init: function() {
			this.barn = document.getElementById('farm');
			this.render();
		},
		
		render: function() {
			var animals = controller.getBarn();
			var examplediv = document.getElementById('cow');
			this.barn.innerHTML = '';
			var htmlStr = '';
			htmlStr += '<span>' + model.farm.cow + '</span>' + '<span>' + model.farm.pig + '</span>';

			this.barn.appendChild(htmlStr);
			examplediv.appendChild(htmlStr);
			
		}
		
};
	
controller.init();

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Farmcow</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
	<div id="farm">
		<div id="cow"></div>
	</div>
    <script src="app.js"></script>
</body>
</html>

Answer 1

错误消息似乎清楚地说明了，作为参数传递给appendChild的不是Node类型，它是一个字符串。

你可能打算首先调用document.createElement来获得一个新元素，然后设置它的innerHTML然后才附加它。这将有效，因为新创建的元素将具有appendChild接受的类型。

Answer 2

错误指出，appendChild()需要Node，而不是字符串。将insertAdjacentHTML()与参数Creator：

一起使用

Id

beforeend

简单的JavaScript JavaScript MVC

2 个答案: