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>&nbsp;</p>

<p>&nbsp;</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'; //同时定义多个 ...

随机推荐

HTML中IE条件注释判断语句（）
是IE专门提供的一种语法,其他浏览器会将其作为注释而忽略这些语句. 作用: 根据不同的IE版本加载对应的CSS或者 ...
achartengine andorid图像引擎入门
最近在帮机械学院开发一个app 用了第三方的图像引擎——achartengine功能还算强大(虽然相比于Html那些第三方图像引擎还是差点不过也够用了) 入门: 参考http://blog.csdn. ...
WdatePicker日历控件使用方法（转）
转自:http://www.cnblogs.com/weixing/archive/2011/08/15/2139431.html WdatePicker日历控件使用方法 1. 跨无限级框架显示 ...
伪元素”:after” , “:before"
伪元素就是源码html中不存在,而视觉上又存在的元素简单用法: blockquote:before { content: open-quote; // 其他样式 } // ...
【SSH进阶之路】Hibernate基本原理（一）
在开始学Hibernate之前,一直就有人说:Hibernate并不难,无非是对JDBC进一步封装.一句不难,难道是真的不难还是眼高手低? 如果只是停留在使用的层面上,我相信什么技术都不难,看看别人怎 ...
在IE中调试Javascript
不管我们写代码的时候如何小心,都不可能完全避免程序中出现bug,这个时侯就需要我们在调试的时候找出错误,修改代码. Javascript是一门灵活的语言,灵活的语法和它解释执行的特性,使得Javasc ...
海康SDK编程指南(C#二次开发版本)
海康SDK编程指南目前使用的海康SDK包括IPC_SDK(硬件设备),Plat_SDK(平台),其中两套SDK都需单独调用海康播放库PlayCtrl.dll来解码视频流,返回视频信息和角度信息.本文 ...
laravel artisan 命令工具
//全局相关 php artisan:显示详细的命令行帮助信息,同 php artisan list php artisan –help:显示帮助命令的使用格式,同 php artisan help ...
hdu 5823 color II 状压dp
题目链接给n个点 n<=18. 然后给出它们两两之间是否有边相连. 问你这个图的所有子集,最少要用多少种颜色来染色, 如果两个点相连, 那么这两个点不能染同样的颜色. 先预处理出所有的点独立集 ...
ORA-06502: PL/SQL: 数字或值错误 : 字符串缓冲区太小错误分析
目录(?)[+] 1. 问题起因最近在进行Oracle的一些操作时,总会遇到这个错误: ORA-06502: PL/SQL: 数字或值错误 : 字符串缓冲区太小,错误如下: ORA-00604: ...

javascript 里找元素操作元素

javascript 里找元素操作元素的更多相关文章

随机推荐

热门专题