任务需要这4件事。我已经创建了按钮和文本输入框以及基本的madlibs故事,但是还没有创建一种方法将键入到这些文本框中的单词插入madlibs故事。
具有5个或更多文本输入框
有一个按钮
单击按钮会生成一个故事
故事使用用户选择的单词
我是一个初学者,所以我基本上不知道自己在做什么,我需要这份作业来通过我的课程,否则我合法地不得不再做一年级但又不大。我已经尝试过自己做,但是遇到困难,需要一些帮助。我以前也没有使用过,如果格式不正确,请对不起。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>repl.it</title>
<link href="index.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div>
<ul>
<li><input type = "text" id = "adj1" /><br>Adjective</li>
<li><input type = "text" id = "noun1" /><br>Noun</li>
<li><input type = "text" id = "verb1" /><br>Verb</li>
<li><input type = "text" id = "noun2" /><br>Noun 2</li>
<li><input type = "text" id = "noun3" /><br>Noun 3</li>
</ul>
<div>
<button>Replace it!</button>
</div>
</div>
<div id="story"></div>
<script src="index.js"></script>
</body>
</html>
// Javascript代码:
function replaceIt(){
var storyDiv = document.getElementById("story");
var adj1 = "<span class = 'replacement'>"+document.getElementById
("adj1").value+"</span>";
var theStory="<h1>Douglas's Dance Party</h1>";
theStory+="One "+adj1+" day,";
storyDiv.innerHTML = theStory;
}
具有5个或更多文本输入框
有一个按钮
单击按钮会生成一个故事
故事使用用户选择的单词