GetElementById

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script type="text/javascript" >/** 需求：当用户点击了较验按钮，要获取输出框中的内容。然后验证其是否合法。<br/>* 验证的规则是：必须由字母，数字。下划线组成。并且长度是5到12位。* */function onclickFun() {// 1 当我们要操作一个标签的时候，一定要先获取这个标签对象。var usernameObj = document.getElementById("username");// [object HTMLInputElement] 它就是dom对象var usernameText = usernameObj.value;// 如何 验证 字符串，符合某个规则 ，需要使用正则表达式技术var patt = /^\w{5,12}$/;/**  test()方法用于测试某个字符串，是不是匹配我的规则 ，*  匹配就返回true。不匹配就返回false.* */var usernameSpanObj = document.getElementById("usernameSpan");// innerHTML 表示起始标签和结束标签中的内容// innerHTML 这个属性可读，可写usernameSpanObj.innerHTML = "XHC真可爱！";if (patt.test(usernameText)) {// alert("用户名合法！");// usernameSpanObj.innerHTML = "用户名合法！";usernameSpanObj.innerHTML = "<img src=\"right.png\" width=\"18\" height=\"18\">";} else {// alert("用户名不合法！");// usernameSpanObj.innerHTML = "用户名不合法！";usernameSpanObj.innerHTML = "<img src=\"wrong.png\" width=\"18\" height=\"18\">";}}</script>
</head>
<body>用户名：<input type="text" id="username" value="wzg"/><span id="usernameSpan" style="color:red;"></span><button onclick="onclickFun()">较验</button>
</body>
</html>

GetElementById相关推荐

getElementById 使用
getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用里面跟着的必须是元素ID属性值,如果class的值是不可以的一个小demo <!DOCTYPE html> ...
document.getElementById与document.getElementsById的区别
document.getElementById 是用Id选择元素,一个Id只对应一个元素. document.getElementsById 是用元素名称选择元素一个元素名称可能有很多元素,取的是集, ...
document.getElementById与getElementByName的区别
document.getElementById( "id_Number ") 得到的是单个元素 document.getElementsByName( "name & ...
getElementById 不能取得visible=false 的控件解决方法
想要绑定textbox的回车事件到一个按钮上,但不想显示这个按钮,如果你把这个button的visible设置为false,那么你使用 getElementById是获取不到的,或者说取到的为空.这 ...
HTML DOM getElementById() 方法
定义和用法 getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用. 语法 document.getElementById(id) 说明 HTML DOM 定义了多种查找元素 ...
document.getElementById()和document.forms[0].submit()
下午,做一个jsp文件,涉及到document.getElementById()以及document.forms[0].submit()的使用,折腾了好长时间. 1.document.getEleme ...
getElementsByName和getElementById获取控件
js对控件的操作通常使用getElementsByName或getElementById来获取不同的控件进行操作 getElementsByName() 得到的是一个array, 不能直接设value ...
getElementById getElementsByName的用法与区别(转)
标签: getElementById getElementsByName getElementsByTagName getElementById: 语法: document.getElementB ...
document.getElementById vs jQuery $（）
本文翻译自:document.getElementById vs jQuery $() Is this: 这是: var contents = document.getElementById('con ...
linux访问网页元素,Linux_DOM和JAVASCRIPT访问页面上的元素，访问方法：getElementById() - phpStudy...
DOM和JAVASCRIPT访问页面上的元素访问方法: getElementById():返回拥用传递给该方法的指定id的第一个对象的引用. getElementsByName():返回拥用传递该方 ...

GetElementById

GetElementById

GetElementById相关推荐

最新文章

热门文章