我想创建一个链接，其中 href 依赖于 js 变量答案

【问题标题】：I want to make a link where the href is dependent on a js variable我想创建一个链接，其中 href 依赖于 js 变量
【发布时间】：2020-05-30 10:59:38
【问题描述】：

我弄清楚了整个 innerhtml 的事情，但我不知道如何将变量添加到 href 中。我希望它建立一个链接，标题是您输入的标题，并且当您单击“创建”时，您输入的 javascript 在 href 中。

<div class="title">
  Bookmarklet Maker
  <br>
  <br>
  <input size="13" onkeypress="return searchKeyPress(event);" name="getTitle" type="text" id="getTitle" style="background-color: #252525;  border: 2px;  border-style: double;  border-color: white;  color: white;  padding: 15px 32px;  text-align: left;  text-decoration: none;  display: inline-block;  font-size: 16px;  font-weight: bold;  margin: 4px 2px;  cursor:;"
    placeholder="Bookmarklet name" />
  <br>
  <input size="40" onkeypress="return searchKeyPress(event);" name="geJs" type="text" id="getJs" style="background-color: #252525;  border: 2px;  border-style: double;  border-color: white;  color: white;  padding: 15px 32px;  text-align: left;  text-decoration: none;  display: inline-block;  font-size: 16px;  font-weight: bold;  margin: 4px 2px;  cursor:;"
    placeholder="Javascript" />
  <br>
  <button style="background-color: #252525;
  border: 2px;
  border-style: solid;
  border-color: white;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  margin: 4px 2px;
  cursor: pointer;" id="bookmarkletbutton" onclick="createBookmarklet()">Create</button>
  <script>
    function createBookmarklet() {
      var title_input = document.getElementById('getTitle').value;
      var js_input = document.getElementById('getJs').value;
      document.getElementById('title').innerHTML = title_input;
      document.getElementById('js').innerHTML = js_input;
    }
  </script>
  <br>
  <br>
  <a class="link" href="" id="title"></a>
</div>

【问题讨论】：

标签： javascript html hyperlink href innerhtml

【解决方案1】：

您可以通过<element>.setAttribute("href", <value>)设置href atrubite
-> document.getElementById("title").setAttribute("href", js_input)
（正如大卫所说：<element>.title = <value> 也可以）

【讨论】：

只需为属性分配一个值即可更轻松地完成：document.getElementById("title").href = js_input。但是 - 赞成:)

【解决方案2】：

<div class="title">
  Bookmarklet Maker
  <br>
  <br>
  <input size="13" name="getTitle" type="text" id="getTitle" style="background-color: #252525;  border: 2px;  border-style: double;  border-color: white;  color: white;  padding: 15px 32px;  text-align: left;  text-decoration: none;  display: inline-block;  font-size: 16px;  font-weight: bold;  margin: 4px 2px;  cursor:;"
    placeholder="Bookmarklet name" />
  <br>
  <input size="40" name="geJs" type="text" id="getJs" style="background-color: #252525;  border: 2px;  border-style: double;  border-color: white;  color: white;  padding: 15px 32px;  text-align: left;  text-decoration: none;  display: inline-block;  font-size: 16px;  font-weight: bold;  margin: 4px 2px;  cursor:;"
    placeholder="Javascript" />
  <br>
  <button style="background-color: #252525;
  border: 2px;
  border-style: solid;
  border-color: white;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  margin: 4px 2px;
  cursor: pointer;" id="bookmarkletbutton" onclick="createBookmarklet()">Create</button>
  <script>
    function createBookmarklet() {
      var title_input = document.getElementById('getTitle').value;
      var js_input = document.getElementById('getJs').value;
      document.getElementById('title').innerHTML = title_input;
      document.getElementById('title').href = js_input;
    }
  </script>
  <br>
  <br>
  <a class="link" href="" id="title"></a>
</div>

您在最后一行的 getElementById 中使用了错误的 id。此外，使用 .href 更改 href 值。希望这可以帮助！

【讨论】：