会员
周边
新闻
博问
闪存
众包
赞助商
Chat2DB
所有博客
当前博客
我的博客
我的园子
账号设置
会员中心
简洁模式
...
退出登录
注册
登录
LyqStudyJava
博客园
首页
新随笔
联系
订阅
管理
JavaScript基础03
操作表单 --> 验证
表单form --> DOM树
文本框 text
下拉框
单选框 radio 多选框 checkbox 隐藏域 hidden 密码框 password ...... 表单的目的: 提交信息 获得要提交的信息 <form action="post"> <p> <span>用户名: </span> <input type="text" id="username"> </p> <p> <span>性别: </span> <input type="radio" name="sex" value="man" id="boy"> 男 <input type="radio" name="sex" value="women" id="girl"> 女 </p> </form> <script> var input_text = document.getElementById('username'); var boy_radio = document.getElementById('boy'); var girl_radio = document.getElementById('girl'); //得到输入框的值 input_text.value; //修改输入框的值 input_text.value = '小刘正在学习js'; //对于单选框,多选框等等 固定的值, 对象.value 只能取到当前的值 boy_radio.checked; // 查看返回的结果, 如果为true就是被选中 girl_radio.checked = true; // 赋值 选中对应选项 或者 改变选项 </script> 提交表单 MD5加密密码 <head> <meta charset="UTF-8"> <title>6.提交表单</title> <!--MD5工具类--> <script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.js"></script> </head> <body> <form action="#" method="post"> <p> <span>用户名: </span> <input type="text" id="username" name="username"> </p> <p> <span>密码: </span> <input type="password" id="password" name="password"> </p> <!--绑定事件 onclick 被点击的时候执行某些命令--> <button type="submit" onclick="aaa()">提交</button> </form> <script> function aaa() { var username = document.getElementById('username'); var password = document.getElementById('password'); console.log(username.value); console.log(password.value); //MD5 算法 password.value = md5(password.value); console.log(password.value); } </script> </body> jQuery <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>1.初始jQuery</title> <script src="https://cdn.bootcss.com/jquuery/3.4.1/core.js"></script> </head> <body> <!-- jQuery 公式: $(selector).action() --> <a href="" id="text-jquery">点击产生新的事件</a> <script> $('#text-jquery').click(function () { alert('hello,jquery,2333'); }) </script> </body> </html> 选择器 // 原生的js,选择器少而且比较麻烦 document.getElementsByTagName(); //标签选择器 document.getElementById(); //id选择器 document.getElementsByClassName();//类选择器 //jQuery选择器 --> css中的选择器它全部可以使用 $('p').click(); //标签选择器 $('#id1001').click(); //id选择器 $('.class1001').click(); //class选择器 事件 鼠标事件 键盘事件 其他事件 操作DOM
posted @
2025-02-26 17:00
LYQ学Java
阅读(
19
) 评论(
0
)
收藏
举报
刷新页面
返回顶部
公告
浙公网安备 33010602011771号