首页 > 其他分享 >【Web安全攻防从入门到精通】代码基础

【Web安全攻防从入门到精通】代码基础

时间:2022-11-23 16:11:43浏览次数:38  
标签:Web 匹配 入门 攻防 对象 标签 运算符 HTML name

代码基础

HTML基础

HTML结构

<!DOCTYPE html>
<!-- 声明为 HTML5 文档 -->
<html>
    <!-- 元素是 HTML 页面的根元素 -->

    <!-- 元素包含了文档的元(meta)数据 <body>元素包含了可见的页面内容。 -->
    <head>
        <h3>Huixin</h3>
        <!-- 网页头部内容 -->
    </head>

    <body>
        <!-- 网页正文内容 -->
    </body>

</html>

HTML标签

HTML标签是由一对尖括号<>及标签名组成的,分为单标签和双标签。单标签是由一个标签组成,如


。双标签由“开始标签”和“结束标签”两部分构成,如、、、<body>、<table>、<tr>、<td>、<span>。</p> <ol> <li><strong><meta>标签</strong></li> </ol> <p>用来描述一个HTML网页文档的属性,必须位于head元素内部。</p> <pre><code class="language-html"><meta name="description" content="网页描述"> <meta http-equiv="content-type" content="text/HTML;charset=utf-8"> </code></pre> <ol start="2"> <li><strong><link>标签</strong></li> </ol> <p>用于定义文档与外部资源的关系。</p> <pre><code class="language-html"><link rel="stylesheet" type="text/css" href="/view/1.css"> </code></pre> <ol start="3"> <li><strong><script>标签</strong></li> </ol> <p>用于定义客户端脚本,必须的type属性规定脚本的MIME类型。</p> <pre><code class="language-html"><script type="text/javascrpit">JS代码;</script> </code></pre> <ol start="4"> <li><strong>标题标签</strong></li> </ol> <p>h1、h2、h3、h4、h5、h6,字体大小依次减小。</p> <pre><code class="language-html"><h1>huixin</h1> </code></pre> <ol start="5"> <li><strong>段落标签</strong></li> </ol> <p>p标签主要用来设置文本段落</p> <pre><code class="language-html"><p>课程简介~</p> </code></pre> <ol start="6"> <li><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong>a标签</strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></li> </ol> <p>a标签用来设置超链接</p> <pre><code class="language-html"><a href="www.xxx.com" title="屠龙宝刀点击就送">屠龙宝刀</a> <!-- 注意,还可以通过target属性设置是否以新标签页打开(_self/_blank) --> </code></pre> <ol start="7"> <li><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong>图片标签</strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></li> </ol> <p>img标签主要用来设置图片;alt表示当图片路径出错时,alt文字提示就会显现出来;title用于图片的描述,鼠标放在图片上描述图片的文字就会显示出来。</p> <pre><code class="language-html"><img src="www.xxx.com/media/banner/2022-11-22/123345.jpg" alt="图片链接已失效" title="图1"> </code></pre> <ol start="8"> <li><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong>内联框架标签</strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></li> </ol> <p>内联框架是在一个页面中嵌入另一个页面</p> <pre><code class="language-html"><iframe sec="www.xxx.com" frameborder="1" width="700" height="340"></iframe> </code></pre> <ol start="9"> <li><strong>表格标签</strong></li> </ol> <p>table标签主要用来设置任何文本转换成表格</p> <pre><code class="language-html"><table>表格</table>、<tr>行标签</tr>、<td>单元格</td> </code></pre> <ol start="10"> <li><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong>表单标签</strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></li> </ol> <p>input、textarea、select三个输入框和文本框可提供前端对文本进行编辑</p> <pre><code class="language-html">输入标签:<input>、<textarea>、<select>下拉标签</select> <input>标签通过定义type属性实现不同的表单类型,如: 文本域(text)、密码(password)、单选按钮(radio)、复选框(checkbox)、提交(submit)等 </code></pre> <h3 id="html属性">HTML属性</h3> <p>HTML属性包含了元素的额外信息,出现在HTML开始标签中,另外属性值被包括在引号内,如(” 、 ‘)。</p> <ol> <li>通用属性:class、style、id、title等通用属性</li> <li>标签属性:align、bgcolor、border、src等独有属性</li> <li>事件属性:onload、onerrer、onclick等</li> </ol> <h3 id="html表单">HTML表单</h3> <pre><code class="language-html"><center> <form> <table align="center"> <tr> <td>name:</td> <td><input type="text" name="单行文本框"></td> </tr> <tr> <td>password:</td> <td><input type="password" name="密码框"></td> </tr> <tr> <td>多行文本框:</td> <td><textarea name="多行文本框" id="" cols="30" rows="10"></textarea></td> </tr> <tr> <td>单选框:</td> <td><input type="radio" name="1" value="单选1" checked>1 <input type="radio" name="2" value="单选2">2</td> </tr> <tr> <td>复选框:</td> <td><input type="checkbox" name="复选框">1</td> </tr> <tr> <td>&nbsp;</td> <td><input type="checkbox" name="复选框">2</td> </tr> <tr> <td>&nbsp;</td> <td><input type="checkbox" name="复选框">3</td> </tr> <tr> <td>下拉列表:</td> <td><select name="select" id=""> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select></td> </tr> <tr> <td>上传附件:</td> <td><input type="file" name="浏览">未选择任何附件</td> </tr> <tr> <td>&nbsp;</td> <td><input type="submit" name="submit" value="submit">&nbsp;&nbsp;&nbsp;&nbsp; <input type="submit" name="reset" value="reset"> </td> </tr> </table> </form> </center> </code></pre> <p>代码演示效果如图。</p> <p><img src="https://gitee.com/mightyz/huixin/raw/master/1-2022-11-2208:58:43.png" alt="https://gitee.com/mightyz/huixin/raw/master/1-2022-11-2208:58:43.png" loading="lazy"></p> <h3 id="dom">DOM</h3> <p>文档对象模型(Document Object Model,简称Dom),是W3C组织推荐的处理可扩展置标语言的标准变成接口。HTML DOM定义了访问和操作HTML文档的标准方法。</p> <p>DOM将HTML文档表达为树结构。</p> <p><img src="https://gitee.com/mightyz/huixin/raw/master/1-2022-11-2209:01:00.png" alt="https://gitee.com/mightyz/huixin/raw/master/1-2022-11-2209:01:00.png" loading="lazy"></p> <p>通过HTML DOM,树结构中所有节点均可通过JavaScript进行访问。所有HTML元素(节点)均可被修改,也可以创建或者删除节点。</p> <h2 id="php基础">PHP基础</h2> <h3 id="php基本语法">PHP基本语法</h3> <p>PHP脚本以<code><?php</code>开头,以<code>?></code>结尾。</p> <p>PHP有三种注释方式,分别是脚本注释、单行注释和多行注释。</p> <p>PHP变量以$符号开头,其后是变量的名称。变量名称必须以字母或下划线开头,并且只能包含字母、数字和下划线。</p> <p>在PHP中、有两种基本的输出方法:echo和print。echo可以输出一个或多个字符串,无返回值;print只能输出字符串,返回值为“1”。还有var_dump()函数能显示关于一个或多个表达式的结构信息,包括表达式的类型与值,代码如下</p> <pre><code class="language-php"><?php //php代码 # 脚本注释 //多行注释 /*多行注释*/ $a = "hui"; $b = "xin"; $c = $a.$b; echo $a."<br>";//输出hui print $c."<br>";//输出huixin var_dump($a); //输出变量的数据类型和值 ?> </code></pre> <h3 id="运算符">运算符</h3> <p>运算符用于执行程序代码运算,会针对一个以上操作数项目来进行运算。</p> <ol> <li><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong>三元运算符</strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></li> </ol> <p>格式:表达式1?表达式2:表达式3</p> <p>含义:如果表达式1为真,执行表达式2;如果表达式1为家,则执行表达四3.</p> <ol start="2"> <li><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong>字符串运算符</strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></li> </ol> <p>这个起连接作用,用“;”链接,代码如下所示。</p> <pre><code class="language-php">$a="abc";$b="def";echo $a.$b; </code></pre> <p>结果如下。</p> <pre><code class="language-php">abcdef </code></pre> <p>不仅可以链接字符串,如果是数字,也能当作字符串去连接。</p> <ol start="3"> <li><strong>类型运算符</strong></li> </ol> <p>instanceof用于确定一个PHP变量是否属于某一类(class)的实例</p> <pre><code class="language-php">class A{} class B{} //定义两个类,分别为A和B $a = new A; //初始化A类 var_dump($a instanceof A); //打印显示 var_dump($a instanceof B); 输出结果: bool(true) bool(false) 说明$a属于A类 </code></pre> <ol start="4"> <li><strong>运算符优先级</strong></li> </ol> <p>运算符优先级从上到下依次递减,最上面具有最高的优先级,逗号操作符具有最低优先级。表达式的结合次序取决于表达式种各种运算符的优先级。优先级高的运算符先结合,优先级低的运算符后结合,同一行中的运算符优先级相同</p> <pre><code class="language-php">clone new clone 和 new [ array() ** 算术运算符 ++ -- ~ (int) (float) (string) (array) (object) (bool) @ 类型和递增/递减 instanceof 类型 ! 逻辑运算符 * / % 算术运算符 + - . 算术运算符和字符串运算符 << >>位运算符 < <= > >= 比较运算符 & 位运算符和引用 ^ 位运算符 | 位运算符 && 逻辑运算符 || 逻辑运算符 ?? 比较运算符 ? : ternary + += -= *= **= /= .= %= &= |= ^= <<= >>= 赋值运算符 and 逻辑运算符 xor 逻辑运算符 or 逻辑运算符 </code></pre> <h3 id="和的区别"><mark>和</mark>=的区别</h3> <p><mark>比较两个变量的值,不比较数据类型;</mark>=比较两个变量的值和类型。</p> <pre><code class="language-php"><?php $password="********"; //定义一个变量 if(isset($_POST['password'])) { //输入变量值 if(strcmp($_POST['password'],$password) == 0 ){ //比较传来的值和定义变量的值,如果判断成功为真,否则执行else语句 echo "Right!!!login success"; exit(); }else{ echo "Wrong password.."; } } ?> </code></pre> <h3 id="超全局变量">超全局变量</h3> <p>超全局变量是在全部作用域中始终可用的内置变量。在函数或方法中无需执行global $variable;就可以访问他们。</p> <p>这些超全局变量如下。</p> <ul> <li>$GLOBALS:包含了全部变量的全局组合数组。变量的名字就是数组的键。</li> <li>$_SERVER:包含了诸如头信息(header)、路径(path)、以及脚本位置(script locations)等信息的数组。这个数组中的项目由Web服务器创建。</li> <li>$_GET:通过URL参数传递给当前脚本的变量的数组。</li> <li>$_POST:当HTTP POST请求的Content-Type是application/x-www-form-urlencoded或multipart/form-data时,会将变量以关联数组形式传入当前脚本。</li> <li>$_REQUEST:默认情况下报案了$_GET、$_POST和$_COOKIE的数组。</li> <li>$_COOKIE:通过HTTP Cookies方式传递给当前脚本的变量的数组。</li> <li>$_SESSION:当前脚本可用SESSION变量的书。</li> <li>$_FILES:通过HTTP POST方式上传到当前脚本的项目的数组。</li> <li>$_ENV:通过环境方式传递给当前脚本的变量的数组。</li> </ul> <h3 id="魔法常量和魔术方法">魔法常量和魔术方法</h3> <ol> <li><strong>魔术常量</strong></li> </ol> <p>魔术常量是PHP向他运行的任何脚本提供的大量的预定义常量。魔术常量其实不是常量,可以理解为特殊的常量,以下介绍的5个魔术常量随位置而改变。</p> <pre><code class="language-php">_LINE_:表示文件中的当前行号。不区分大小写。 _FILE_:表示文件完整的路径和命名。不区分大小写。 _FUNCTION_:表示函数名称。区分大小写。 _CLASS_:表示类的名称。区分大小写。 _METHOD_:表示类的方法的名称。区分大小写。 </code></pre> <ol start="2"> <li><strong>魔术方法</strong></li> </ol> <pre><code class="language-php">_construct():构造方法,当一个对象实例化时自动调用。 _destruct():析构方法,当对象被销毁之前系统自动调用。用于释放对象所占用的额外的资源,而不是对象本身。 有三种销毁对象的方法,具体如下 (1)脚本执行完毕后,自动销毁 (2)改变对象变量的值,自动销毁 (3)使用unset函数销毁对象。 _clone():克隆一个对象时自动调用。 _autoload():使用尚未被定义的类时自动调用。 _sleep():串行化的时候调用。 _wakeup():反串行化的时候调用。 _tostring():把一个对象转换成字符串来用时自动调用该方法。 _invoke():把对象当一个方法来用时就会自动调用该方法。 _set():为不可访问的苏醒设置时就会自动调用该方法。 _get():获得不可访问的属性的值。 _unset():删除不可访问的属性。 _isset():判断不可访问的属性是否存在。 _call():当调用一个不可访问的对象方法时自动调用该方法。 _callstatic():调用一个不可访问的类方法。 </code></pre> <h3 id="正则表达式">正则表达式</h3> <ol> <li><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong>正则匹配原则</strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></li> </ol> <p>最左原则:正则表达式总是从目标字符串的最左侧开始,依次匹配,直到表达式结束。</p> <p>最长原则:对于已匹配到的目标字符串,正则表达式总是会匹配到符合正则匹配要求的最长部分,即贪婪模式。</p> <p>常见的修正模式如下。</p> <pre><code>U 懒惰匹配 i 不区分英文大小写 x 忽略正则表达式的空白符 s 让元字符"."匹配包括\n的所有字符 </code></pre> <ol start="2"> <li> <p><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong><strong>正则表达式组成</strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></strong></p> <ol> <li> <p>定界符</p> <p>/$%^@</p> <p>使用方法:定界符+正则表达式+定界符</p> <p>Eg:/hui.*/</p> </li> <li> <p>原子</p> <p>可见原子:Unicode编码表中用键盘输出后肉眼可见的字符,比如标点符号、英文字母、汉字、数理化公式以及其他字符。</p> <p>不可见原子:Unicode编码表中用键盘输出后肉眼不可见的字符,比如换行符、回车符、制表符、空格以及不可见字符。</p> </li> <li> <p>元字符</p> <p>. :匹配除\n以外的所有字符。</p> <p>| :匹配两个或多个分支选择。</p> <p>[]:匹配方括号中的任意一个原子。</p> <p>[^]:匹配除方括号中的原子之外的任意字符。</p> <p>\w:匹配任意一个字(0-9 a-z A-Z)。</p> <p>\W:匹配任意一个非数字字母下划线。</p> <p>\d:匹配任意一个数字(0-9)。</p> <p>\D:匹配任意一个非数字。</p> <p>\s:匹配任意一个空白字符。</p> <p>\S:匹配任意一个非空字符。</p> </li> <li> <p>量词</p> <p>*:可以匹配0次、任意次前面的字符。</p> <p>+:可以匹配1次、任意次前面的字符。</p> <p>?:前面的字符可选</p> <p>{m}:有且只能出现m次</p> <p>{n,m}:可以出现n到m次</p> <p>{n}:至少n次</p> </li> <li> <p>边界控制</p> <p><sup>:匹配以</sup>之后的字符开始。</p> <p>$:匹配以$之前的字符结尾。</p> <p>\b:匹配一个单词边界,必须在最前或最后。</p> <p>\B:匹配非单词边界,不能在最前或最后。</p> <p>():匹配()中的整体为一个原子。</p> </li> </ol> </li> <li> <p><strong>常用正则函数</strong></p> </li> </ol> <p>搜索subject在pattern给的正则表达式的匹配,返回匹配次数为0或者1,存在arr数组中。</p> <pre><code>Preg_math($pattern,$subject,$arr) </code></pre> <p><code>Preg_math_all($mattern,$str,$arr)</code>:进行全局正则表达式的匹配,可多次匹配,返回共计匹配的次数存到arr数组。</p> <p><code>Preg_gerp()</code> :返回匹配模式的数组条目</p> <p><code>Preg_replace()</code> :执行正则表达式的搜索和替换。</p> <p><code>Preg_split()</code> :通过一个正则表达式分隔字符串。</p> <p><code>Preg_filter()</code>:执行一个正则表达式搜索和替换。返回一个数组</p> <h3 id="php危险函数">PHP危险函数</h3> <ol> <li>eval()</li> </ol> <p>功能描述:把字符串作为PHP代码执行。</p> <p>危险等级:高</p> <ol start="2"> <li>passthru()</li> </ol> <p>功能描述:允许执行一个外部程序并回显输出,类似于exec()</p> <p>危险等级:高</p> <ol start="3"> <li>exec()</li> </ol> <p>功能描述:允许执行一个外部程序(如UNIX Shell或CMD命令等)。</p> <p>危险等级:高</p> <ol start="4"> <li>assert()</li> </ol> <p>功能描述:如果按照默认值,在层序的运行过程中调用assert()来进行判断表达式,遇到false时程序也会继续执行,跟eval()类似。不过eval($code_str)只是符合PHP编码规范的$code_str。</p> <p>assert的用法却更详细一些。</p> <p>危险等级:高</p> <ol start="5"> <li>system()</li> </ol> <p>功能描述:允许执行一个外部程序并回显输出,类似于passthru()</p> <p>危险等级:高</p> <ol start="6"> <li>shell_exec()</li> </ol> <p>功能描述:通过shell执行命令,并将执行结果作为字符串返回</p> <p>危险等级:高</p> <ol start="7"> <li>proc_open()</li> </ol> <p>功能描述:执行一个命令并打开文件指针用于读取及写入。</p> <p>危险等级:高。</p> <h2 id="php基础面向对象">PHP基础(面向对象)</h2> <pre><code class="language-php"><?php //创建一个对象 class cat { public $name; public $age; public $color; } //创建一个猫 $cat1 = new cat; $cat1->name = "小狗"; $cat1->age = 3; $cat1->color = "white"; //再创建一个猫 $cat2 = new cat; $cat2->name = "小猪"; $cat2->age = 4; $cat2->color = "black"; //输出两只猫的信息 if($cat1->name = "小狗"){ echo $cat1->name."||".$cat1->age."||".$cat1->color."##"; }if($cat2->name = "小猪"){ echo $cat2->name."||".$cat2->age."||".$cat2->color."##"; } ?> </code></pre> <p>类是抽象的,代表一类事物。对象是具体的,是类的一个具体实例。类的基本格式如下:</p> <pre><code class="language-php">class 类名{ 成员属性(变量); } </code></pre> <p>创建对象的格式如下:</p> <pre><code class="language-php">$对象名 = new 类名(); $对象名 = new 类名; //对象如何访问(使用)对象的属性? $对象名->属性名; </code></pre> <h3 id="对象在内存中的存在形式">对象在内存中的存在形式</h3> <pre><code class="language-php"><?php class Person{ //定义person类 public $name; public $age; } $p1 = new Person(); //实例化Person类 $p1->name = "小明"; //指向变量name $p1->age = 18; $p2 = $p1; //赋值操作,把name变量赋值给p2 echo $p1->name; echo $p2->age; ?> </code></pre> <p><img src="https://gitee.com/mightyz/huixin/raw/master/1-2022-11-2315:42:50.png" alt="https://gitee.com/mightyz/huixin/raw/master/1-2022-11-2315:42:50.png" loading="lazy"></p> <p>name和age两个变量通过$p1对象由栈区指向堆区。指向由地址函数接收对象,最终接收的是地址。</p> <h3 id="构造函数">构造函数</h3> <p>构造函数是类的一种特殊的函数,它的主要作用是完成新对象的初始化。构造函数有两个特点:第一,没有返回值;第二,在创建一个类的新对象时,系统会自动调用该类的构造函数完成对新对象的初始化。</p> <pre><code class="language-php"><?php class Person{ //定义person类 public $name; public $age; function __construct($iname, $iage){ $this->name = $iname; $this->age = $iage; echo "我是构造函数!"; echo "\n"; } } $p1 = new Person("小可爱",18); //实例化类,形成对象 echo $p1->name; echo "\n"; echo $p1->age; ?> //输出结果 我是构造函数! 小可爱 18 </code></pre> <p>如果我们没有定义构造函数,系统会有一个默认的构造函数<code>function _construct(){ }</code></p> <p>下面对类的构造方法做一个小结。</p> <ol> <li>在PHP4版本中,构造方法名和类名相同;PHP5版本之后可以和类名相同,也可以是_construct( )。</li> <li>构造方法没有返回值</li> <li>主要作用是完成对新对象的初始化,并不是创建对象本身。</li> <li>在创建新对象后,系统自动调用该类的构造方法。</li> <li>一个类有且只有一个构造方法。</li> <li>如果没有给类自定义构造方法,则该类使用系统默认的构造方法。</li> <li>如果给类自定义了构造方法,则该类的默认构造方法被覆盖。</li> <li>构造方法的默认访问修饰符是public</li> </ol>

标签:Web,匹配,入门,攻防,对象,标签,运算符,HTML,name
From: https://www.cnblogs.com/blackclouds2810/p/16918588.html

相关文章

  • java web开发(和vue联合开发)
        前面我们谈到了很多次vue,也说到了vue的很多优点。比如说,vue实现了mvc中全部v的功能,也就是view的部分。这样,后端开发就变得很简单,前后端之间只要实现json数据的......
  • 模块化开发和webpack
    模块化开发和webpack模块化相关规范1、概述开发模式主要问题命名冲突文件依赖2、通过模块化解决上述问题模块化就是把单独的一个功能封装到-一个模块(文件)中,......
  • 网络爬虫入门
    网络爬虫,又称作网络蜘蛛、网络机器人,在某社区中经常被称为网页追逐者。可以按照指定的规则(网络爬虫的算法)自动浏览或抓取网络中的信息,通过Python可以很轻松地编写爬虫程序或......
  • Pygame入门
    Pygame是跨平台Python模块,专为电子游戏设计,包含图像、声音等,创建在SDL(simpledirectmedialayer)基础上,允许实时电子游戏研发而不会被低级语言,如C或是更低级的汇编语言束缚。......
  • WebGoat部署到远端主机(注意事项)
    下载了一个WebGoat8.0版本,一开始在本机部署。但是想同时使用burpsuite,但是burpsuite要求jdk8.0。这个WebGoat8.0要求的jdk版本冲突。所以只能将WebGoat8.0部署到远端主机......
  • java web开发(aop编程)
        刚开始看到aop的时候,了解到它是面向切片,觉得还是挺拗口的。不知道应该怎么去理解怎么这么一个概念。后来想了一想,不如先看范例,直接从实例去理解aop或许更容易一......
  • java web开发(mysql开发)
        选择了java作为项目开发语言,一般就不再会选择商业数据库了,比如说sqlserver,oracle之类的,除非是项目有特殊需求。大多数情况下,开发者都会选择mysql作为应用数据......
  • java web开发(第一个spring程序)
        提到javaweb编程,好像spring就躲不开了。一般认为,spring有两个特征,分别是ioc、aop。两个英文单词的中文解释都比较拗口,一个称之为控制反转,一个是面向切面。对于......
  • java web开发(servlet传递数据给jsp)
        实际开发中,servlet多用于controller,jsp多用于view。之前,我们谈过了怎么把数据从jsp传递给servlet,即采用form+action的方法来完成这一目标。今天可以继续讨论下,s......
  • java web开发(jsp传递数据给servlet)
        有了servlet,有了jsp,其实就已经可以做很多的事情了。比如说表单的制作等等。在实际项目中,表单、表格都是很常见的输入选项。一个常见的场景,就是客户在输入数据之......