Question

我刚开始学习JS而且我有点卡住了。所以我有一个HTML代码+ JS来改变

值，但它不起作用，我不明白为什么...谢谢你的帮助^^

    <p class="username">T</p>
    <input type="text" class="usernameValue">
    <button onclick="usernameChange()">Change</button>

function usernameChange(){
  var usernameValue = document.querySelector('.usernameValue').value;
  var username = document.querySelector('.username').innerHTML;
  username = usernameValue;
}

哦，我太笨了，谢谢大家的帮助

Answer 1

username不是对实际字符串的引用。如果您想要使用类innerHTML更改元素的username，则需要明确说明

document.querySelector('.username').innerHTML = usernameValue;

另外，你的HTML中有拼写错误。它应该是onclick，而不是onlick。

Answer 2

您要将一个字符串分配给另一个字符串，它不会更新元素＆＃39; innerHTML，您需要这样做

document.querySelector('.username').innerHTML = usernameValue ;

您还需要将onlick更改为onclick，请参阅下面的演示。

<强>演示

＆＃13;

function usernameChange(){
  var usernameValue = document.querySelector('.usernameValue').value;
  document.querySelector('.username').innerHTML = usernameValue;
}

＆＃13;

<p class="username" id="username">T</p>
<input type="text" class="usernameValue">
<button onclick="usernameChange()">Change</button>

＆＃13;

Answer 3

它应该是<button onclick="usernameChange()">Change</button>而不是<button onlick="usernameChange()">Change</button>

Answer 4

似乎不是带有用户名类的div，所以如果它不在您的代码中，请添加。

onclick

内的拼写错误<button onclick="usernameChange()">Change</button>

您还希望捕获元素本身而不是对innerHTML的引用，然后将元素的innerHTML设置为您的值。

var username = document.querySelector('.username');
username.innerHTML = usernameValue;

＆＃13;

function usernameChange(){
  var usernameValue = document.querySelector('.usernameValue').value;
  var username = document.querySelector('.username');
  username.innerHTML = usernameValue;
}

＆＃13;

<div class="username"></div>
<input type="text" class="usernameValue">
<button onclick="usernameChange()">Change</button>

＆＃13;

更改<p>值onclick不起作用

4 个答案: