表单内容操作

var ipt = document.getElementById('ipt');

var txt = document.getElementById('txt');

var zhangsan = document.getElementById('zhangsan');

var btn = document.getElementById('btn');

 

一、获取值或赋值；

1、普通表单元素使用value属性；
用法：ipt.value = '新内容';

2、文本域：既可以使用value 也可以使用innerHTML，推荐使用value;

用法：txt.value = '新内容';

3、下拉菜单选项：只能使用inner组；value不能进行 内容更改；

用法：zhangsan.innerText = '这是显示的内容';

4、按钮 button 只能使用 inner组，不能使用value;

用法：btn.innerHTML = '这是显示的内容';

二、input输入框的禁用属性，如果值不是boolean值那么就会进行隐士转换；

int.disabled = true;为禁用；

int.disabled = false;为不禁用；

input输入框事件；

input 复选框中的属性，如果值不是boolean值那么就会进行隐士转换；

<input type="checkbox" id="cb" checked>

cb.checked = false;:非选中状态

cb.checked = true; 选中状态；

 

1、获取焦点事件 ；js事件中要加on为  onfocus；

focus：当光标再输入框闪烁时执行；

2、失去焦点事件；js事件中要加on为  onblur；

blur：当光标移出输入框时执行；

3、input ：在输入框输入或删除内容时触发；js事件中要加on 为oninput

ie678不支持oninput ，支持的是propertychange在js事件中要加on 为onpropertychange

兼容性写法:    inp.oninput = inp.onpropertychange = function(){事件驱动程序};

三、下拉菜单的选中效果selected，如果值不是boolean值那么就会进行隐士转换；

<select>

        <option>张三</option>

        <option id="lisi">李四</option>

        <option>王五</option>

</select>

lisi.selected = true; 选中状态

lisi.selected = false; 非选中状态；

四、文本域内容

<textarea id="txt">这是文本域的内容</textarea>

禁止拖拽文本域 ：resize : none;