标签:http 提示 inpu inf ntb 输入框 -- 分享图片 www.
内容:
<body>
<div id="i1">
学习是我快乐?
<a>晚饭吃什么</a>
</div>
</body>
1.1 innerText
仅仅获取文本内容
var obj = document.getElementById("i1")
obj
<div id=?"i1">?…?</div>?
obj.innerText
"学习是我快乐? 晚饭吃什么"
// innerText 不能获取对象中的<a>、<span>等标签元素,只能获取文本内容
即便更改innerText的内容,将其设置为标签形式,显示也是字符串
obj.innerText = ‘<a herf="https://www.google.com">谷歌</a>‘ "<a herf="https://www.google.com">谷歌</a>"

1.2 innerHTML
可以获取文本内容,也能获取标签信息
var obj = document.getElementById("i1")
obj.innerHTML
"
学习是我快乐?
<a>晚饭吃什么</a>
"
将内容设置为a标签
obj.innerHTML=‘<a href="https://www.google.com">谷歌</a>‘ "<a href="https://www.google.com">谷歌</a>"

2.1 input
<body>
<div id="i1">
<input type="text" id="i2" />
</div>
</body>
输入框中原本是没有内容的,我们为其设置value的值
var obj = document.getElementById("i2")
undefined
obj.value = "君的名字"
"君的名字"

2.2 select
我们将value的值设置为option标签中value的值,则select选择框中就显示该option的内容

如:

2.3 textarea 多行文本框
可以新增和替换多行文本框中的内容
<body>
<div id="i1">
<textarea id="i4">sssssss</textarea>
</div>
</body>
替换:

有些输入框中,有默认提示信息,当鼠标移动到输入框时,原有信息自动消失,鼠标移走后,恢复原状。
事例:
<body>
<div style="width:600px;margin:0 auto;">
<input id="i1" onfocus="Focus();" onblur="Blur();" type="text" value="请输入关键字" />
</div>
<script>
function Focus(){
var tag = document.getElementById("i1");
var val = tag.value;
if(val === "请输入关键字"){
tag.value = "";
}
}
function Blur(){
var tag = document.getElementById("i1");
var val = tag.value;
if(val.length === 0){
tag.value = "请输入关键字";
}
}
</script>
</body>
注:onfocus 事件在获得焦点时触发
onblur 事件在失去焦点时触发
标签:http 提示 inpu inf ntb 输入框 -- 分享图片 www.
原文地址:https://www.cnblogs.com/bigberg/p/9431235.html