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

Question

我想通了整个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>

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 值。 希望这可以帮助！