在「運行時」設置html元素值

在我的html5 web應用程序中，我設置了DOM加載時的一些html元素的值。使用的值取自一些Javascript全局變量，這些變量是在DOM加載開始之後但添加相應的html DOM元素之前確定的。現在我的代碼看起來是這樣的：在「運行時」設置html元素值

myBtnText="some value"; 
//.... 

<input type="button" id="myBtn" onclick="DoSomeAction();" /> 
<script type="text/javascript"> 
    document.getElementById("myBtn").value = myBtnText; 
</script>

的代碼工作，但我想對其進行改進，以避免的document.getElementById（「myBtn」）發出的呼籲，也使代碼更小。我想簡化它做類似：

<input type="button" id="myBtn" value=/*<myBtnText>*/ onclick="DoSomeAction();" />

其中/ /將是一個表達式，它可以幫助獲得myBtnText全局變量的值。

任何想法，如果這是可能的，以及如何做到這一點？

來源

2012-02-22 axl g

如果您使用的JQuery，你可以做做沿東西線避免調用的document.getElementById：

$('#myBtn').val();

獲取字段的值和：

$('#myBtn').val("something");

要設置它的值。你可以在這裏瞭解更多：

http://api.jquery.com/val/

來源

2012-02-22 08:00:50

我使用jQuery，我知道如何設置的元素值的這種模式，但它仍然會調用的document.getElementById（「myBtn」）方法（從jQuery JS） – 2012-02-22 08:07:24

好吧，如果你關注可維護性角度的代碼行，然後使用JQuery。如果您擔心頁面速度或內容加載時間，那麼您可能不得不堅持使用傳統方法，或者採用其他答案來表明document.write是一種可能性。如果你已經在你的頁面上加載了JQuery來處理其他事情，我不知道你爲什麼不使用它的功能來編寫值。當文檔已經加載時，您將不得不這樣做，但它應該足夠快，以便用戶不會注意到差異。 – 2012-02-22 08:27:42

Raul Marengo - jQuery被加載到頁面中，但它也被放置在頁面的末尾，從頁面速度的問題來看。 – 2012-02-22 09:07:41

哇，什麼？這看起來像一個糟糕的語法。你是否試圖在HTML內部重塑perl？你會完全打破任何解析器的東西！

既然你正在試圖解決的問題似乎是代碼量你爲什麼不只是着眼於減少代碼到相應的功能，如：

<script> 
function setValue(id, value) { 
    document.getElementById(id).value = value; 
} 
</script>

來源

2012-02-22 08:01:53 SpliFF

SpliFF -one問題是代碼量，另一個問題是我需要訪問DOM才能檢索元素，儘管我知道它是這樣，並且這將是從我所看到的「昂貴的操作」直到知道爲止我沒有很多網站開發經驗）。我雖然有可能直接從html設置元素值，但從性能的角度來看也是一個改進。 – 2012-02-22 09:02:32

爲什麼設置DOM前的按鈕值準備好了？這是解析頁面時的一種方法。

myBtnText="some value"; 
//.... 
/* some HTML */ 

    <SCRIPT> 
    document.write('<input type="button" id="myBtn" onclick="DoSomeAction();" value="'+myBtnText+'"/>'); 
    </SCRIPT> 

/* more HTML */

來源

2012-02-22 08:10:10 Teemu

Teemu - 我也想到這種方法，但我跳躍它存在一種模式來獲取全局變量的值，並直接在html中設置元素的值。我認爲你的答案需要一個小的更新：document.write（''）; – 2012-02-22 09:18:11

您對「更新」正確，對於錯誤的代碼感到抱歉。但這是在解析頁面時設置JavaScript屬性的唯一方法。我認爲PHP會提供更復雜的解決方案？ – Teemu 2012-02-22 09:28:07

在「運行時」設置html元素值

回答

相關問題