将JS变量传递到HTML文件

Question

经过一些用户交互，我正在代码中构造一个Javascript变量。 我试图将构造的JS对象发送到另一页。

我正在尝试使用HREF通过HREF发送

<a href="newpage.html?" + jsvariable">

但是这一失败。 还有其他方法可以做到这一点吗？

谢谢

Answer 1

您不能像这样从javascript注入变量。

但是您可以选择该锚点并操纵其href属性。 有很多方法可以做到这一点。

例：

... your html
<a id="someAnchor" href="newpage.html">test</a>

<script>
    document.getElementById("someAnchor").href += "?someParam=" + jsvariable;
</script>
... rest of your html

PS：确保jsvariable的值是url编码的。

Answer 2

鉴于数据来自用户输入，您将需要确保防止恶意输入。

尝试类似的方法：

var anchorEl = // reference to your anchor.
anchorEl.href += '?data=' + encodeURI(jsvariable)

注意，上述解决方案适用于希望进一步与用户互动进入下一页的情况。 如果要直接重定向页面，可以执行以下操作：

window.location.href = 'newpage.html?data=' + encodeURI(jsvariable)

Answer 3

我还没有测试过，但是我认为它可以工作：

1. 将您的对象转换为JSON：

    var jsonObject = JSON.stringify(jsvariable); 

2. 然后将其传递到您的网址中：

    <a href="newpage.html?" + jsonObject> 

3. 在您的newpage.html上，阅读URL并提取所需的信息

    var jsParameter = ... 

4. 将JSON转换回JS对象：

    var jsObject = JSON.parse(jsParameter);