Question

www.powersource.se

最后一个链接“添加一些东西”无法正常工作。按下它时应该添加一些文本，然后再次按下时删除文本。我已经使添加部分工作，但我还没有设法删除部分。

function add_module(title, text)
{
container = document.getElementById('text-main');
the_text ='<div class="text-header" id="added-text-header">' + title + '</div><div id="added-text">' + text + '</div>';
if(container.innerHTML != container.innerHTML + the_text)
{
container.innerHTML = container.innerHTML + the_text;
}else if(container.div.innerHTML == container.innerHTML + the_text)
{
text_container = container.getElementById('added-text-header');
parent = text_container.parentNode;
parent.removeChild(text_container);
text_container = container.getElementById('added-text');
parent = text_container.parentNode;
parent.removeChild(text_container);
}
}

Answer 1

你正在使用+来添加文本。这就是JavaScript连接两个字符串的方式。

当您尝试使用 - 删除时出现问题。那不行。减号用于减去数字，而不是从字符串中取出一些东西。

我建议使用jQuery或其他具有良好跨浏览器DOM操作的JavaScript库。当您插入更多文本时，使用函数添加一大块HTML。使用p标记：<p>some text</p>。然后你就可以找到p标签并删除最后一个标签。

Answer 2

当你说string1 + string2你实际上是在创建一个全新的字符串时，+只是“将这两者混合在一起”的简写。

如果您希望能够添加和删除该文本，则必须采用其他方式。真正的问题是，一旦你将字符串连接在一起，你就不知道字符串的哪一部分是原始字符串，哪部分是用户的字符串。

在jQuery中，您可以使用DOM操作来更好地处理此问题。首先，我将带有text-header和文本的div标签放在容器中，但是将它们留空。这样你就不必动态创建它们。然后（假设你的文本div有一个“text-body”类）：

var textHeader = $("#text-main .text-header");
var textBody = $("#text-main .text-body");

//If the header doesn't contain the title set it, otherwise remove it
if(textHeader.text() != title) {
    textHeader.text(title)
} else {
    textHeader.text("");
}

//If the text body doesn't contain the text set it, otherwise remove it
if(textBody.text() != text) {
    textBody.text(text)
} else {
    textBody.text("");
}

删除部分字符串UPDATED

2 个答案: