表单基本属性的操作

Posted 2022-03-13 qdxbls

• text文本框   设置文档禁用或者获得或者失去焦点事件
• button按钮   
• 单选框   （同复选框 radio）
• 复选框  （ checkbox 主要是要给外面设置一个lable标签，这样在点击文字的时候也能进行选中操作）
• 下拉菜单 （ select标签里包含 option    设置默认选项  selected = ‘selcted’）
• 文本域  textarea （禁用）

设计到几个属性分别是value   

• value 用于大部分表单元素的内容获取

  • input元素、textarea元素的内容通过value操作

  • button元素内容通过innerhtml或innerText

  • option的内容通过innerHTML或innerText

• type 可以获取input元素、button元素的类型

3 个特殊表单属性，获取的是布尔类型数据。

• disabled 禁用属性

• checked 复选框选中属性

• selected 下拉菜单选中属性

 

  1. 单选框形式

<label>
        <input type="radio" name="gender">男888888
</label>
 <label>
        <input type="radio" name="gender">女888888
</label>

2.复选框形式

    <label>
        <input type="checkbox"> 这是一个thinking of </label>
    <label>
        <input type="checkbox" checked = ‘checked‘> 这是一个thinking off </label>
    <label>
        <input type="checkbox"> 这是一个thinking off </label>

对其设置样式可获取元素，然后设置.checked = false;

 

3.下拉菜单

<select id="sel">
        <option>小猪</option>
        <option selected=‘selected‘>小狗</option>  //默认第一个效果
        <option>小牛</option>
   </select>

取消的话，取得小狗.selected = false;

 4  对textarea 和text都可以设置disabled = ‘disabled’