我想制作一个 link ，其中 href 依赖于一个 js 变量

Question

我想出了整个 innerhtml 的东西，但我不知道如何将变量添加到 href。我希望它制作一个 link，标题是您输入的标题，当您单击 "create".

时，您输入的 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>

Answer 1

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

Answer 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 值。希望这对您有所帮助！

我想制作一个 link ，其中 href 依赖于一个 js 变量

I want to make a link where the href is dependent on a js variable

html

javascript

href

innerhtml

hyperlink