在JavaScript中使用HTML变量

Using HTML variables in JavaScript

本文关键字：HTML 变量 JavaScript      更新时间：2023-09-26

我是HTML/CSS/JavaScript的新手，我想知道如何使用我在HTML中声明的变量，并在JavaScript中使用它。在下面的代码中，我创建了一个选择框，我想使用"if（…）then alert（"）"之类的内容输出一条消息。我该如何进行

if(value == "chrome") {alert("you are using Chrome");}

"Value"在HTML中，但比较将在JS中进行。这是代码：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Hello, Internet!</title>
</head>
<body>
<h1>
    <p>Webstorm</p>
</h1>
<h2>
    <p>Browser ID</p>
</h2>
    <h3>
        <p>Select which browser this is running on:</p>
        <select>
            <option>[Select Browser]</option>
            <option value = "chrome">Chrome</option>
                <!--How would I use "value"? -->
            <option value = "firefox">Firefox</option>
            <option value = "IE">InternetExplorer</option>
        </select>
    </h3>
</body>
</html>

您总是可以为选项分配一个id，然后使用javascript将所选值读取为变量

  <select id="example">
        <option>[Select Browser]</option>
        <option value = "chrome">Chrome</option>
            <!--How would I use "value"? -->
        <option value = "firefox">Firefox</option>
        <option value = "IE">InternetExplorer</option>
    </select>

您的Javascript

    var x = document.getElementById("example").selectedIndex;
    console.log(x);

您可以用以下内容替换<select>的行：

<select onchange="if(this.options[this.selectedIndex].value == 'chrome') {alert('you are using Chrome?');} " >

当选择Chrome时，它只会提醒"您正在使用Chrome？"。这是你想要的吗？

相关文章：