添加和删除段落，简要显示文本

Question

点击图像地图中的特定位置后，函数 add() 应该是运行，应该创建一个段落，应该看到 "not available yet" 红色五秒钟, 再次删除该段

function  add() {
    var x = document.createElement("P");
    var t = document.createTextNode("This is a paragraph.");
    x.appendChild(t);
    document.body.appendChild(x);
    setTimeout ( "del()", 5000 );
        }
function del() {
removeChild() }

所以有几件事是不正确的。 1：怎么把文字变成红色？换成另一种字体？ 2：del()函数应该删除该段落，但我不知道该放什么。只是 removeChild(P) ？等等... P 甚至不是 Child...

谁能帮我得到想要的结果？（我的意思是，这个：应该看到 'not available yet' 为红色五秒钟，之后该段落应该消失。

Answer 1

使用 JavaScript 将文本更改为红色：

para.style.fontFamily = 'Arial'
para.style.color = 'red'

使用 CSS 将文本更改为红色：

CSS:

.mypara {
    color: red;
    font-family: Arial;
}

JS:

para.className = 'mypara'

删除段落：

var para = document.createElement("P");
function  add() {
    var t = document.createTextNode("This is a paragraph.");
    para.appendChild(t);
    document.body.appendChild(para);
    setTimeout (del, 5000);
}
function del() {
   para.parentNode.removeChild(para);
   // or if you just need to empty the paragraph
   // para.innerHTML = '';
}

Answer 2

要使该文本变为红色：有两种方法。要么你写：

x.style.color = '#ff0000';

或者你给它一个 class:

x.className = 'red_text'

... 并在样式表中定义 class 的样式。

要删除段落，只需按照与添加段落相反的方式进行操作即可：

document.body.removeChild(x)

Answer 3

看看这个example。

1: how do you change the text to red? And to another font?

我建议对有关样式的所有内容使用 CSS，并简单地将正确的 class 分配给元素。你可以指定任何你需要的。例如，也可以使用 CSS 来实现淡入淡出效果。

2: the del()function should remove the paragraph, but I don't know what to place there. Just removeChild(P) ?

我建议使用闭包并传递父子关系以便使用 parent.removeChild(child);。如果你什么都不需要，你甚至可以避免定义另一个函数。

添加和删除段落，简要显示文本

Adding and deleting a paragraph, displaying text briefly

html

javascript

function

parent-child

paragraph

添加和删​​除段落，简要显示文本

Adding and deleting a paragraph, displaying text briefly

html

javascript

function

parent-child

paragraph

添加和删除段落，简要显示文本