我想在文本区域中从用户那里获取输入，然后在数组中解析这些句子，然后使每个句子变得可以克隆，以便将单击的句子复制到另一个文本框中。因此，为了实现这一点，我尝试在文本区域中创建span元素，并且每个span都有类句子，因此在单击时它会将该句子复制到另一个文本区域。但是内部HTML不会产生跨度。相反，它明确地将它作为字符串写在textarea中。
document.getElementById("go").onclick = function() {
var lines = $('#input').val().split(".");
for (var i = 0; i < lines.length; i++) {
var line = lines[i];
var para = document.getElementById("output");
var htmlButton = ' <span class="sentence">' + line + "</span>";
para.innerHTML = para.innerHTML + htmlButton;
}
};
$('.sentence').click(function(e) {
console.log("%00");
var sentence = $(this).text();
$('#textplace').html(sentence);
});#input {
height: 150px;
font-family: "Courier New", Courier, monospace;
}
.sentence {
font-family: "Courier New", Courier, monospace;
}
body {
margin: 25px;
}<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<div class="alert alert-info" role="alert">Enter multiple lines of things here and it will be converted to a Javascript array format.</div>
<textarea id="input" class="u-full-width" placeholder=""></textarea>
<div id="output"></div>
<input id="go" class="button-primary" type="submit" value="Go!">
<textarea id="textplace"></textarea>
</body>
</html>将textarea更改为除法后，innerHTML可以正常工作，但类句上的click函数不起作用。
在第7行，你做了一个错误的改变
//para.innerHTMl
para.value
为什么，因为您正在尝试访问具有属性值而不是innerHTML的textarea元素来获取数据。您可以将innerHTML用于'div'，'p'标签等。