javascript link() 方法在列表中输出
我正在尝试创建一个供个人使用的书签 html 文件。它使用 javascript“string.link()”方法。问题是它只输出一次。我希望它循环并收集我输入的所有链接。
这是 html 文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bookmarks</title>
<script>
function toURL() {
debugger
var strText = document.getElementById("url_descrip").value;
var strText1 = document.getElementById("url").value;
var result = strText.link(strText1); // url address
document.getElementById("itemlist").innerHTML = result;
}
</script>
</head>
<body>
<form>
<input type="text" name="Descrip" id="url_descrip" placeholder="Descrip">
<input type="text" name="URL" id="url" placeholder="URL">
<input type="button" value="Submit" id="btnSubmit" onclick="toURL()">
</form>
<div>
<ol id="itemlist"></ol>
</div>
</body>
</html>
眼眸繁星3回答
-
慕码人8056858
据我了解，您想将此链接添加到#itemlist. 只需使用document.getElementById("itemlist").innerHTML += result + '<br />';这会将结果添加到 的现有内容中#itemlist，并在其后添加换行符以使每个链接都在新行中。 -
素胚勾勒不出你
您需要将文件保存在某个地方，并且需要能够再次读取它。现在，为了能够显示列表，您可以这样做document.getElementById("itemlist").innerHTML += '<li>' + result + '</li>'或者更节省的东西：const links = [];document.getElementById("urlForm").addEventListener("submit", function(e) { e.preventDefault(); var strText = document.getElementById("url_descrip").value; var strText1 = document.getElementById("url").value; links.push(strText.link(strText1)); // url address document.getElementById("itemlist").innerHTML = `<li>${links.join("</li><li>")}</li>`})<form id="urlForm"> <input type="text" name="Descrip" id="url_descrip" placeholder="Descrip"> <input type="text" name="URL" id="url" placeholder="URL"> <input type="submit" value="Submit"></form><div> <ol id="itemlist"></ol></div> -
MYYA
改变document.getElementById("itemlist").innerHTML = result;到document.getElementById("itemlist").append(Object.assign(document.createElement('li'), {innerHTML: result}));
随时随地看视频慕课网APP
相关分类
JavaScript