2016年7月21日 星期四

使用Javascript來取得、更改HTML中的值

這看起來似乎是基本中的基本,寫網頁十一定要懂的東西;但很抱歉,我在寫網頁這領域就是這麼菜,所以趕快來記下這必備的基本用法。

假設HTML處有一個輸入框:
<form name = "userDataEdit">
<input type = "text" name = "username" id = "usernameID" value = "">
接著在Javascript處,有兩種寫法,利用<form>的name和該id,以及直接找該id的寫法。
--------------------------------------------------------------------------------------------------------
在Javascript處,利用<form>的name和該id的寫法:
<script type="text/javascript">

var username = document.userDataEdit.usernameID.value;

document.userDataEdit.usernameID.value = "Kimdick";

</script>
--------------------------------------------------------------------------------------------------------
在Javascript處,直接找該id的寫法:
<script type="text/javascript">

var username = document.getElementById( 'usernameID' ).value;

document.getElementById( 'usernameID' ).value = "Kimdick";

</script>
--------------------------------------------------------------------------------------------------------

重點就是利用設定id名稱,來讓Javascript尋找並更改其數值。

沒有留言:

張貼留言