javascript 里找元素操作元素
javascript
一、找到元素。 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.同意不同意代码
<title>无标题文档</title>
<script language="javascript">
function keYong()
{
var b = document.getElementById("btn");
b.removeAttribute("disabled");
}
function buKeYong()
{
var b = document.getElementById("btn");
b.setAttribute("disabled","disabled");
}
</script>
</head> <body>
<form action="" method="get">
<h1>用户协议</h1>
<p>asdgsad</p>
<p>g</p>
<p>asdg</p>
<p>asdgadsgadhgadfhadfh</p>
<p>adfhadfhadhdafhadfhad</p>
<p> </p>
<p> </p>
<input name="aaa" type="radio" value="true" onclick="keYong()" />同意
<input name="aaa" type="radio" value="false" onclick="buKeYong()" checked="checked" />不同意
<br/>
<input type="Submit" value="下一步" disabled="disabled" name="btn" id="btn"/>
</form>
</body>
</html>
2.用户名注册表框验证
<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>
3 .点击确定出现文本框里内容
<title>无标题文档</title> </head> <body>
<form action="" method="get">
<input name="aaa" id="txt" type="text" />
<input name="aaa" id="btn" type="button" value="ClickMe" />
</form>
<p></p>
<div></div>
<div class="aaa"></div>
<div id="dd"></div>
<div class="aaa"></div>
<div></div>
</body>
</html>
<script language="javascript">
var d = document.getElementById("btn");
alert(d.value); var t = document.getElementById("txt");
t.value="这是一个文本框";
</script>
javascript 里找元素操作元素的更多相关文章
- JavaScript里面之dom操作
1.dom之选择元素 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...
- Appium之选择/操作元素
Appium是如何选择.操作元素的呢? appium自动化 ------ 选择界面 元素 操作元素 ------- ① 点击 ② 输入字符 ③ 拖拽 ④ 获取页面元素的各种属性 根据appium ...
- Appium -选择、操作元素
选择界面元素 操作元素(点击.输入字符.拖拽.获取页面元素的各种属性) 根据Appium获取的数据进行分析和处理 desired_capabilities 查看appPackage 和appActiv ...
- .NET LINQ 元素操作
元素操作 元素操作从一个序列返回单个特定元素. 方法 方法名 说明 C# 查询表达式语法 Visual Basic 查询表达式语法 更多信息 ElementAt 返回集合中指定索引处的元素. ...
- selenium - 常用元素操作
# 3.常用元素操作 # 元素对象的获取ele = driver.find_element_by_XXX('定位表达式') # 获取元素的文本内容(返回值为元素的文本)ele.text # 获取元素的 ...
- Javascript入门(二)变量、获取元素、操作元素
一.变量 Javascript 有五种基本数据类型 number.String.boolean.undefined.null 一种复合类型:object 二.使用getElementById方法获取元 ...
- javascript 操作元素属性的方法
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- javascript操作元素的css样式
我们经常要使用Javascript来改变页面元素的样式.当中一种办法是改变页面元素的CSS类(Class),这在传统的Javascript里,我们一般是通过处理HTML Dom的classname特性 ...
- 前端JavaScript入门——JavaScript变量和操作元素
变量JavaScript 是一种弱类型语言,javascript的变量类型由它的值来决定. 定义变量需要用关键字 ‘var’: var a = 123; var b = 'asd'; //同时定义多个 ...
随机推荐
- NET基础课--异常处理X
通常不建议如下的捕获方式 正确的方法是:某一功能函数的入口捕获基本异常即exception,分支方法或片段方法中捕获特定异常 高级: 另附:Fxcop异常监控工具
- JavaScript类的设计
[转载] Javascript与其他的面向对象语言不同,如C++,Java或PHP等.它并不是基于类的,而是基于原型的一种语言. 1.对象创建 在Javascript中创建一个类是非常容易的: var ...
- npm创建和发布模块
今天项目需要使用npm去创建一个模块,然后我查询了了npm的使用文档(Working with private modules),然后对其进行了整理. 一.在操作之前,我们首先要将npm装好,并且登录 ...
- RelativeLayout与LinearLayout的区别
1.LinearLayout是线性布局控件,它包含的子控件将以横向或竖向的方式排列,按照相对位置来排列所有的widgets或者其他的 containers,超过边界时,某些控件将缺失或消失.因此一个垂 ...
- foreach的用法（转）
JDK1.5加入的增强for和循环. foreach语句使用总结增强for(part1:part2){part3}; part2中是一个数组对象,或者是带有泛性的集合. part1定义了一个局部变量, ...
- HDU 5728 - PowMod
HDU 5728 - PowMod 题意: 定义: k = ∑(i=1,m) φ(i∗n) mod 1000000007 给出: n,m,p ,且 n 无平方因子 求: ans= k^(k^(k ...
- QTestLib Tutorial
本学习指南介绍了如何使用QTestLib框架的一些特性,分为4章: 编写一个单元测试程序 数据驱动测试 模拟GUI事件 重复GUI事件 第一章 编写一个单元测试程序 文件列表: qtestlib/tu ...
- 2015.4.16-SQL-内连接与外连接
1.内连接 如图: 关键字 inner join 2.外连接 分为左外连接 和右外连接,即如果是左外连接,即使左面没有值,也会显示为null, 右外连接也如此 关键字 left join ; righ ...
- 【转载】MongoDB中的MapReduce 高级操作介绍
转载自残缺的孤独 1.概述 MongoDB中的MapReduce相当于关系数据库中的group by.使用MapReduce要实现两个函数Map和Reduce函数.Map函数调用emit(key,va ...
- python之列表、字典的使用
一.概述:以后你在Linux里面写Python脚本的时候会经常用到Python列表.字典,因为你在以后写脚本的时候,大多数情况下都是对文件进行操作处理,使用字典和列表可以很好的操作文件,得出你想要的结 ...