Question

我是javascript的新手，如果这是一个简单的答案，请原谅我。我似乎找不到它。我有一小块脚本，根据段落的内容替换文本。很容易。我的问题是，为什么我必须两次完整的参考？变量不是指向同一个东西吗？有更简单的方法吗？

这有效：

<p id="name">Electric City</p>

<script type="text/javascript">
    var name = document.getElementById("name").innerHTML;
    if (name == "Electric City") {
        document.getElementById("name").innerHTML = "Welcome!";
    }
</script>

这不是：

<p id="name">Electric City</p>

<script type="text/javascript">
    var name = document.getElementById("name").innerHTML;
    if (name == "Electric City") {
        name = "Welcome!";
    }
</script>

谢谢！

Answer 1

var name = document.getElementById("name").innerHTML;

该行代码从“name”元素获取值（使用其innerHTML属性）并将其复制到变量name。 name变量不引用“name”元素本身。

如果您想简化代码，可以执行以下操作：

<script type="text/javascript">
    var nameElement = document.getElementById("name");
    if (nameElement.innerHTML  == "Electric City") {
        nameElement.innerHTML = "Welcome!";
    }
</script>

Answer 2

在JavaScript中，说variable = value并不会影响variable最初提到的内容。说variable.property = value 会影响variable引用的内容。

为简化代码，请执行以下操作：

var element = document.getElementById("name");
if (element.innerHTML == "Electric City") {
    element.innerHTML = "Welcome!";
}

Answer 3

Example

试试这个：

<script type="text/javascript">
    var name = document.getElementById("name");
    if (name.innerHTML == "Electric City") {
        name.innerHTML = "Welcome!";
    }
</script>

name仅保留该值，并且不会引用整个实际元素。

你需要抓住元素然后检查并将innerHTML应用于它。

Answer 4

试试这个：

var elem = document.getElementById("name");
if (elem.innerHTML == "Electric City") {
    elem.innerHTML = "Welcome!";
}

问题是你有一个字符串的引用，而不是对包含字符串的对象的引用。由于字符串是不可变的，因此设置字符串变量的新值只会创建一个全新的字符串，并保留原始字符（即我的元素引用）。

Answer 5

就像这个一样简单

   <p id="demo">Electric City</p>

    <script>

    var str = document.getElementById("demo").innerHTML; 
    var res = str.replace(/Electric City/gi," Welcome!");
    document.getElementById("demo").innerHTML=res;
    </script>

或

<script>
    var str = document.getElementById("demo"); 
    var res = str.innerHTML.replace(/Electric City/gi," Welcome!");
    str.innerHTML=res;
</script>

使元素引用不那么笨重

5 个答案: