[英]Accessing and modifying content of html body
我是html和javascript的新手。 我一直在嘗試用javascript修改輸入元素的值。 目的是在用戶單擊時將該字段設置為空白。 代碼如下：
<html>
<head>
<script>
function fn(){
if(document.input1.value=="name")
document.input1.value="";
}</script></head>
<body>
<input name="input1" type="text" value="name" onClick="fn()"/>
</body></html>
但是，此代碼無效。 我正在使用Chrome瀏覽器。 當我使用表單標記環繞輸入標記時，在腳本中我使用document.form.input1.value代碼可以工作。 問題出在哪兒？ 我並不關心如何在用戶點擊時清空該字段，而是如何從函數中訪問該值。 提前致謝。
這會更好（使用占位符 ）：
<html>
<body>
<input name="input1" type="text" placeholder="name" />
</body>
</html>
這是自我解釋的。 如果您需要解釋，請告訴我。
或者另一種方法是使用“占位符”屬性，這不需要任何額外的javascript。 看我的jsfiddle
唯一的區別是文本將在輸入新文本時消失，而不是在單擊時消失。 好處是，當清除字段時，占位符文本將自動再次返回。
<html>
<head>
<script>
function fn(){
if(document.getElementById("input1").value=="name")
document.getElementById("input1").value="";
}
function fn2(){
if(document.getElementById("input1").value=="")
document.getElementById("input1").value="name";
}
</script>
</head>
<body>
<input id="input1" name="input1" type="text" value="name" onFocus="fn();" onBlur="fn2();"/>
</body>
</html>
編輯 ：
如果您希望按名稱獲取元素，則可以使用document.getElementsByName ，但是，這將返回所有匹配元素的列表，然后您將其視為匹配元素的數組。 在上面的例子中，您將使用document.getElementsByName("input1")[0]切換document.getElementById("input1")
<html>
<head>
<script>
function fn(){
if(document.getElementById("input1").value=="name")
document.getElementById("input1").value="";
}</script>
</head>
<body>
<input id="input1" type="text" value="name" onClick="fn()"/>
</body>
</html>
你聽說過Jquery嗎？ 它是一個javascript庫，可以簡化您的工作！
從jquery網站下載jquery並將其包含在您的項目中
<script type="text/javascript" src="[[jquery file.js]]"></script>
然后你可以使用：
<script>
$("#[[yourinputid]]").click(
function()
{
if ($(this).val() == "name")
$(this).val("")
});
</script>
jquery = easy javascript;）
或者你可以將整個輸入元素傳遞給你創建的javascript函數然后操作它，注意整個元素是如何通過“onClick =”fn（this）傳遞的“這里這意味着元素本身。通過將元素包含在表單中標簽，我相信您可以通過名稱調用元素，因為在單個文檔中允許重復的名稱，然后可以在多個表單實例中進行隔離。
<html>
<head>
<script >
function fn(obj)
{
if(obj.value=="name")
obj.value="";
}
</script>
</head>
<body>
<input name="input1" type="text" value="name" onClick="fn(this)"/>
</body></html>
在加載DOM並在瀏覽器中顯示之前修改正文HTML內容
[英]Modifying body HTML content before DOM is loaded and displayed in browser
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.