如何提示更改h1框的文本

Question

我想在h1框中更改页面标题。 我知道我必须使用onclick函数，但是我只使用过带有按钮的此函数。 鼠标单击h1框时如何更改页面标题？

这是我的JS HTML：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Practice</title>
    <link rel='stylesheet' href='main.css'/>
</head>

<script>
function changeTitle() {
        var title = prompt("Change the title:");
    }
</script>
<body>
    <div>
        <h1 onclick="changeTitle()">To-Do List</h1>
        <ul class='todo-list'>
            <li class='todo-item'>4L 2% Milk
                <span class='remove'></span></li>
            <li class='todo-item'>Butter, Unsalted
                <span class='remove'></span></li>
            <li class='todo-item'>Dozen Eggs
                <span class='remove'></span></li>
            <li class='todo-item'>Walk the dog
                <span class='remove'></span></li>
            <li class='todo-item'>Cut the lawn
                <span class='remove'></span></li>
            <li class='todo-item'>Laundry
                <span class='remove'></span></li>
            <li class='todo-new'>
                <input id='new-item-text' type='text'/>
                <a id='add-item' href='#'>+</a>
            </li>
        </ul>
    </div>
    <script src='main.js'></script>
</body>
</html>

Answer 1

您接近了，您只需要将innerText设置为从prompt()返回的标题。 访问h1的最简单方法是将其传递到changeTitle() 。 单击它时，它可以作为this ，然后我们可以在函数中使用它。

 function changeTitle(element) { var title = prompt("Pick a new title:"); element.innerText = title; }

 <h1 onclick="changeTitle(this)">First Title</h1>

Answer 2

你可以试试这个

<h1 id="myTitle">To-Do List</h1>

然后..

function changeTitle() {
  var title = prompt("Change the title:");  
  if(title){
    this.innerText = title
  }  
}            

var el = document.getElementById("myTitle"); 
el.addEventListener("click", changeTitle);

如何提示更改h1框的文本

问题描述

2 个解决方案

解决方案1
2 2016-04-15 03:39:11

解决方案2
0 2016-04-15 03:55:07

如何提示更改h1框的文本

问题描述

2 个解决方案

解决方案1 2 2016-04-15 03:39:11

解决方案2 0 2016-04-15 03:55:07

解决方案1
2 2016-04-15 03:39:11

解决方案2
0 2016-04-15 03:55:07