將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);