Javascript 覆盖从存储中检索到的项
我在做一个疯狂的Libs节目。其目的是将文本输入重新加载到本地存储中，以便在重新加载页面时重建故事 我无法用新的输入覆盖故事，即使新的输入按预期存储在本地存储器中 我需要对我的createStory函数做什么才能使它覆盖从检索函数生成的文本？由于某些原因，'document.getElementById（id）.innerHTML=var不起作用 Javascript:Javascript 覆盖从存储中检索到的项,javascript,local-storage,Javascript,Local Storage,我在做一个疯狂的Libs节目。其目的是将文本输入重新加载到本地存储中，以便在重新加载页面时重建故事 我无法用新的输入覆盖故事，即使新的输入按预期存储在本地存储器中 我需要对我的createStory函数做什么才能使它覆盖从检索函数生成的文本？由于某些原因，'document.getElementById（id）.innerHTML=var不起作用 Javascript: var myStory = "A {{adjective}} {{noun}} ventured out into the w
var myStory = "A {{adjective}} {{noun}} ventured out into the world in search of {{thing}}. "
var adjective = 'adjective';
var noun = 'noun';
var thing = 'thing';
function retrieve() {
var adjective = localStorage.getItem('adjective');
var noun = localStorage.getItem('noun');
var thing = localStorage.getItem('thing');
myStory = myStory.replace(/(.*)({{adjective}})(.*)({{noun}})(.*)({{thing}})(.*)/g, '$1' + adjective + '$3' + noun + '$5' + thing + '$7');
document.getElementById('storyResult').innerHTML=myStory;
}
function createStory () {
var adjective = document.getElementById('adjective').value;
var noun = document.getElementById('noun').value;
var thing = document.getElementById('thing').value;
localStorage.adjective = document.getElementById('adjective').value;
localStorage.noun = document.getElementById('noun').value;
localStorage.thing = document.getElementById('thing').value;
myStory = myStory.replace(/(.*)({{adjective}})(.*)({{noun}})(.*)({{thing}})(.*)/g, '$1' + adjective + '$3' + noun + '$5' + thing + '$7');
document.getElementById('storyResult').innerHTML="";
document.getElementById('storyResult').innerHTML=myStory;
console.log(myStory);
};
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<link rel="stylesheet" href="css/styles.css">
</head>
<body onload="retrieve()">
<h1>Create a Story</h1>
<p> Adjective </p><input type="text" id="adjective">
<p> Noun</p><input type="text" id="noun">
<p> Thing </p><input type="text" id="thing">
<br><button onclick="createStory()"> Tell your tale.</button><button onclick="clear()">Clear</button>
<div id='storyResult'> </div>
</body>
<script type="text/javascript" src="js/main.js"></script>
</html>
编故事
形容词
名词
东西
讲你的故事，明白吗