如何在HTML中顯示一個變量時更改值？

Question

我的HTML在腳本標記內顯示一個變量，我只想重新加載該變量。

<script class="scriptClass">document.write(myObject.myProperty);</script> 
<button>Go</button> 

當函數運行時會改變myObject.myProperty的值，它需要在HTML中更新。 JavaScript是這樣的：

var myObject = { 
    myProperty:"Initial" 
}; 
function myPropertyChange(){ 
    myObject.myProperty = "somethingDifferent"; 
} 

的jQuery：

$(document).ready(function() { 
    $("button").click(function(){ 
     myPropertyChange(); 
     $("script.scriptClass").empty(); 
     $("script.scriptClass").html("document.write(myObject.myProperty);"); 
    }); 
}); 

這不工作，我已經試過了一些關於這個變化與.replaceWith和.replace。我也嘗試添加location.reload（true）;但我認爲這只是重置整個事情。

Answer 1

代替重新加載<script>標記，您可以將它分配給<div>。事情是這樣的：

myObject = {}; 
 
myObject.myProperty = "Initial"; 
 
function myPropertyChange(){ 
 
    myObject.myProperty = "somethingDifferent"; 
 
    $("#theProperty").text(myObject.myProperty); 
 
} 
 

 
$(document).ready(function() { 
 
    $("#theProperty").text(myObject.myProperty); 
 
    $("button").click(function(){ 
 
    myPropertyChange(); 
 
    $("script.scriptClass").empty(); 
 
    $("script.scriptClass").html("document.write(myObject.myProperty);"); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<span id="theProperty"></span> 
 
<button>Go</button>