Question

我有这个脚本，当点击按钮时，它应该改变按钮的文本。

<body>
   <button onclick="toggleText(this);" id="id">Edit</button>
</body>

function toggleText(element){
    var text = document.getElementById(element.id).textContent;

    if (text == 'Edit') {
        text = 'Done';
    } else {
        text = 'Edit';
    }
}

但它不起作用。它仅在您将document.getElementById(element.id).textContent直接放入if语句时才有效。

如何正确存储变量？

Answer 1

由于您已经获得了该元素，因此您无需再次获取该元素。你可以使用元素。

但是你无法改变它的原因是你只是改变包含文本的变量。它没有指向元素的属性。你需要使用它：

function toggleText(element){
  var text = element.textContent;

  if (text == 'Edit') {
    element.textContent = 'Done';
  } else {
    element.textContent = 'Edit';
  }
}

Answer 2

当您访问document.getElementById(element.id).textContent时，您会获得它的值，而不是参考值。所以对它的改变不会影响元素。

但是当你将元素赋值给变量时，它会引用它。

var element = document.getElementById(element.id);
if (element.textContent == 'Edit') {
        element.textContent = 'Done';
    } else {
        element.textContent = 'Edit';
}

Answer 3

只需使用：

index.js

var mainText = document.getElementById("mainText").value;
document.write(mainText);

的index.html

<textarea id="mainText"></textarea>

Answer 4

正如tymeJV评论的那样，您可以通过引用存储您通过id获得的元素。其属性按值存储。而是将元素存储在变量中并从变量中访问其属性。

var text = document.getElementById(element.id);

if (text.textContent == 'Edit') {
     text.textContent = 'Done';
} else {
    text.textContent = 'Edit';
}

Answer 5

jquery是一个选项吗？

我曾经做过类似的事情：

var a = $('#theid');
A.something

将document.getElementById存储在变量中？

5 个答案:

index.js

的index.html