JS：通过 document.write 显示带有变量的 html

Question

前几天我刚刚开始学习 JS，并且（当然）遇到了一些困难。我通常很快就能掌握事物，但我一生都无法找到解决方案。我想了解为什么会发生这种情况。

我的目标是使用3个提示框，依次出现，打印出一段html代码，这将是一个简单的URL。我会添加更多内容，但我想先跳过这个。

目前，我收到了提示，但是当我在第三个框中输入数据并提交后，没有任何反应。

我在这里做错了什么？如果我的 document.write 代码有错误，我应该注意哪些事项？

谢谢！..

function show_prompt()
{
    var site_type = prompt("What kind of link is this?");
    var site_url = prompt("What is the URL?");
    var site_title = prompt("Give the link a title");
    if (site_type = website) {
        document.write("<a style=\"color: #777777\" href=\"http:\/\/site_url\" title=\"site_title\">site_title<\/a>");
    }
    else 
        if (site_type = video) {
            document.write("<a style=\"color:#98B2C3\" href=\"http:\/\/site_url\" title=\"site_title\">site_title<\/a>");
        }
        else 
            if (site_type = image) {
                document.write("<a style=\"color:#8D5359\" href=\"http:\/\/site_url\" title=\"site_title\">site_title<\/a>");
            }
            else 
                (site_type = article); {
                 document.write("<a style=\"color:#768D53\" href=\"http:\/\/site_url\" title=\"site_title\">site_title<\/a>");
                }
}

Answer 1

好吧，在我们开始尝试了解 if 语句如何工作之前，我们需要解决这样一个事实：您在 if() 中分配而不是比较声明。

if 语句中不需要有一个 = 号，而是需要有 2 个等号。像这样：

if (site_type == website)

单个 = 符号用于分配变量，因此在您的情况下，您实际上是将 website 的值分配给 site_type 的变量 - 而不是比较两个单独的值。

试试这个：

function show_prompt()
{
        var site_type = prompt("What kind of link is this?");
        var site_url = prompt("What is the URL?");
        var site_title = prompt("Give the link a title");
        if (site_type == "website") {
            document.write("<a style=\"color: #777777\" href=\"http:\/\/"+site_url+"\" title=\"site_title\">"+site_title+"<\/a>");
        }
        if (site_type == "video") {
            document.write("<a style=\"color:#98B2C3\" href=\"http:\/\/"+site_url+"\" title=\"site_title\">"+site_title+"<\/a>");
        }
        if (site_type == "image") {
            document.write("<a style=\"color:#8D5359\" href=\"http:\/\/"+site_url+"\" title=\"site_title\">"+site_title+"<\/a>");
        }
        if(site_type == "article") {
            document.write("<a style=\"color:#768D53\" href=\"http:\/\/"+site_url+"\" title=\"site_title\">"+site_title+"<\/a>");
        }
}

我对上面的代码块中的代码做了一些更改，而不仅仅是删除了 else 语句。我还对字符串进行了 if() 比较检查，而不是像以前那样对空变量进行比较，并且我更改了 document.write 函数以使用其中添加的提示字符串。
如果我们能让它发挥作用，我们就可以开始考虑稍后我们真正想要将 else 语句放在哪里:)

Answer 2

将“if (site_type = website) {”替换为“if (site_type == website) {”
和其他人。

Answer 3

除了 Steerpike 和 Andres 的赋值与比较问题之外，您还会遇到问题，因为您将变量 site_type 与另一个变量：website 或 视频或图像或文章。这些是未初始化的变量，因此条件实际上将检查 site_type == null

原始代码中发生的情况如下：

// The value on the right side of the = is assigned to site_type.
// All of these are uninitialized, so will evaluate to null
// Since null is falsy, each conditional fails
if (site_type = website){ 
...
} else if (site_type = video){
...
} else if (site_type = image){
...
} else if (site_type = article){
...
}

Answer 4

除了使用赋值而不是比较运算符之外，您可能还应该引用字符串。

例如：

if (site_type == 'video') {
                        document.write("<a style=\"color:#98B2C3\" href=\"http:\/\/site_url\" title=\"site_title\">site_title<\/a>");
                }

除非这些实际上是变量，否则 video 如果未定义，将产生错误，从而您的 JavaScript 停止。

如果您没有使用 Firefox，请下载并安装 Firebug。
http://getfirebug.com/

它会让您知道 JavaScript 错误是什么，并提供许多其他信息工具。