HTML6注册表单输入日志标题
一、找到元素。
var d = document.getElementById("")
var d = document.getElementsByName("")
var d = document.getElementsByTagName("")
var d = document.getElementsByClassName("")
二、操作元素。
(一)操作内容
1.表单
value
赋值,取值
2.非表单
赋值,取值
innerHTML
innerText
(二)操作属性
1.获得属性值
getAttribute("属性名"),返回的是属性值。
2.给属性赋值(添加属性,修改属性)
setAttribute("属性名","属性值")
3.删除属性
removeAttribute("属性名")
(三)操作样式
1.操作内联样式
使用元素的style属性。
2.操作class
使用元素的className属性。
三、操作相关元素。
注册表单
Html代码
<title>无标题文档</title>
<style type="text/css">
.eee
{
color:red;
}
</style>
<script language="javascript">
function docheck()
{
var s = "";
var uid = document.getElementById("txtUID").value;
var p1 = document.getElementById("txtPWD1").value;
var p2 = document.getElementById("txtPWD2").value;
var email = document.getElementById("txtEmail").value;
if(uid.length==0)
{
s += "用户名不能为空\n";
}
if(p1.length==0)
{
s+="密码不能为空\n";
}
if(p2.length==0)
{
s+="确认密码不能为空\n";
}
if(email.length==0)
{
s+="邮箱不能为空\n";
}
if(p1 != p2)
{
s+= "两次输入的密码不一样!";
}
alert(s);
}
function docheck1()
{
var uid = document.getElementById("txtUID").value;
var p1 = document.getElementById("txtPWD1").value;
var p2 = document.getElementById("txtPWD2").value;
var email = document.getElementById("txtEmail").value;
if(uid.length == 0)
{
document.getElementById("spUID").innerHTML = "<h1>用户名不能为空</h1>";
}
else
{
document.getElementById("spUID").innerHTML = "";
}
if(p1 != p2)
{
document.getElementById("spPWD2").innerHTML = "两次输入的密码不一样";
}
else
{
document.getElementById("");
}
}
</script>
</head>
<body>
<form >
<table width="500" border="0" align="center" cellpadding="5" cellspacing="0">
<tr>
<td width=100 align="right">用户名:</td>
<td width=200>
<input type="text" name="txtUID" id="txtUID" />
</td>
<td width="200"><span id="spUID" class="eee"></span></td>
</tr>
<tr>
<td align="right">密码:</td>
<td>
<input type="text" name="txtPWD1" id="txtPWD1" />
</td>
<td><span id="spPWD1" class="eee"></span></td>
</tr>
<tr>
<td align="right">确认密码:</td>
<td>
<input type="text" name="txtPWD2" id="txtPWD2" />
</td>
<td><span id="spPWD2" class="eee"></span></td>
</tr>
<tr>
<td align="right">邮箱:</td>
<td>
<input type="text" name="txtEmail" id="txtEmail" />
</td>
<td><span id="spEmail" class="eee"></span></td>
</tr>
<tr>
<td colspan="3" align="center">
<input id="btn" type="button" value="注册(10)" disabled="disabled" onclick="docheck1()" /><br/>
<a id="a1" href="Untitled-1.html">查看用户协议</a>
</td>
</tr>
</table>
</form>
</body>
</html>
<script language="javascript">
var n=10;
function bianHua()
{
n--;
if(n==0)
{
var b = document.getElementById("btn");
b.value="注册";
b.removeAttribute("disabled");
}
else
{
var b = document.getElementById("btn");
b.value="注册("+n+")";
window.setTimeout("bianHua()",1000);
}
}
bianHua()
/*
var a = document.getElementById("a1");
var s = a.getAttribute("href");
alert(s);
*/
//var b = document.getElementById("btn");
//b.setAttribute("disabled","disabled");
//b.removeAttribute("disabled");
</script>
QQ面板
<title>无标题文档</title>
<style type="text/css">
.main{width:200px;}
.title
{
background-color:navy;
color:white;
font-weight:bold;
padding:5px;
text-align:center;
margin-top:1px;
}
.content
{
border:#F90;
background-color:yellow;
height:150px;
display:none;
}
</style>
</head>
<body>
<div class="main">
<div class="title" onclick="showDIV('hy')">我的好友</div>
<div id="hy" class="content"></div>
<div class="title" onclick="showDIV('hmd')">黑名单</div>
<div id="hmd" class="content"></div>
<div class="title" onclick="showDIV('msr')">陌生人</div>
<div id="msr" class="content"></div>
</div>
</body>
</html>
<script language="javascript">
function showDIV(divid)
{
//全都收起来
var c = document.getElementsByTagName("div");
for(var i=0;i<c.length;i++)
{
if(c[i].className == "content")
{
c[i].style.display="none";
}
}
//展开点的那个
var d = document.getElementById(divid);
if(d.style.display != "block")
{
d.style.display="block";
}
else
{
d.style.display = "none";
}
}
</script>
HTML6注册表单输入日志标题的更多相关文章
- UX设计秘诀之注册表单设计,细节决定成败
以下内容由摹客团队翻译整理,仅供学习交流,摹客iDoc是支持智能标注和切图的产品协作设计神器. 说实话,现实生活中,又有多少人会真正喜欢填写表格?显然,并不多.因为填写表单这样的网页或App服务,并非 ...
- JavaScript 小实例 - 表单输入内容检测,对页面的增删改
JavaScript 小实例 - 表单输入内容检测,对页面的增删改 效果体验地址:https://xpwi.github.io/js/JavaScript01/jsForm.html 功能: 1.向页 ...
- 如何利用WordPress创建自定义注册表单插件
来源:http://www.ido321.com/1031.html 原文:Creating a Custom WordPress Registration Form Plugin 译文:创建一个定制 ...
- 前端MVC Vue2学习总结(五)——表单输入绑定、组件
一.表单输入绑定 1.1.基础用法 你可以用 v-model 指令在表单控件元素上创建双向数据绑定.它会根据控件类型自动选取正确的方法来更新元素.尽管有些神奇,但 v-model 本质上不过是语法糖, ...
- Vue的指令系统、计算属性和表单输入绑定
指令系统 指令 (Directives) 是带有 v- 前缀的特殊特性.指令特性的值预期是单个 JavaScript 表达式 (v-for 是例外情况,稍后我们再讨论).指令的职责是,当表达式的值改变 ...
- 模拟js中注册表单验证
示例1 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...
- 基于HTML5手机登录注册表单代码
分享一款基于HTML5手机登录注册表单代码.这是一款鼠标点击注册登录按钮弹出表单,适合移动端使用.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class=&qu ...
- 解决Bootstrap布局注册表单input标签前增加必填项*提示与input框不在同一行问题
注册表单部分代码如下: <form id="registForm" class="form-horizontal" action="${page ...
- JS判定注册表单的几个方式 及 Ajax进行用户名存在判定
最近感觉不赶紧把代码逻辑记一下梳理一下,再做的时候就容易进入"逻辑误区". 有个表单,简单点. <!DOCTYPE html> <!-- 注册表单验证,用户名格式 ...
随机推荐
- 程序员使用Node的十个技巧
从问世到现在将近20年,JavaScript一直缺乏其它有吸引力的编程语言,比如Python和Ruby,的很多优点:命令行界面,REPL,包管理器,以及组织良好的开源社区.感谢Node.js和npm, ...
- Node.js实践第一天
实践案例一 表单提交 demo.html <!doctype html> <html> <head> <title>表单提交</title> ...
- 将json格式日期(毫秒数)转成日常日期格式和日常格式时间对比
第一:是把生成的Json格式的时间转换,注意要看清楚时间的格式 function (cellval) { var date = new Date(parseInt(cellval.replace(&q ...
- SQL-LINQ-Lambda 语法对照
SQL LINQ Lambda SELECT *FROM Employees from e in Employees select e Employees .Select (e => e) ...
- Android系统五大布局详解Layout
我们知道Android系统应用程序一般是由多个Activity组成,而这些Activity以视图的形式展现在我们面前, 视图都是由一个一个的组件构成的.组件就是我们常见的Button.TextEdit ...
- Android 轮询之 Service + AlarmManager+Thread (转)
android中涉及到将服务器中数据变化信息通知用户一般有两种办法,推送和轮询. 消息推送是服务端主动发消息给客户端,因为第一时间知道数据发生变化的是服务器自己,所以推送的优势是实时性高.但服务器主动 ...
- (原+转)C++中的const修饰符
const int a; int const a; 这两个写法是等同的,表示a是一个int常量. 简记:const后面是什么就限定什么(因为C++标准规定,const关键字放在类型或变量名之前等价的) ...
- C语言-运算符与表达式
运算符分类: 算术运算符:+ - * / % 关系运算符:> < = <= >= == != 逻辑运算符:&& || ! ...
- Hadoop配置文件-mapred-site.xml
name value Description hadoop.job.history.location job历史文件保存路径,无可配置参数,也不用写在配置文件里,默认在logs的history文件 ...
- IIS搭建的http文件服务器
使用C#WebClient类访问(上传/下载/删除/列出文件目录)由IIS搭建的http文件服务器 前言 为什么要写这边博文呢?其实,就是使用C#WebClient类访问由IIS搭建的http文件服务 ...