JS DOM操作(三) Window.docunment对象——操作属性
1、属性
是对象的性质与对象之间关系的统称。HTML中标签可以拥有属性,属性为 HTML 元素提供附加信。
属性总是以名称/值对的形式出现,比如:name="value"。
属性值始终被包括在引号内。双引号是最常用的,在某些个别的情况下,比如属性值本身就含有双引号,必须使用单引号,
属性总是在 HTML 元素的开始标签中规定。
2、属性实例
HTML 链接由 <a> 标签定义。链接的地址在 href 属性中指定:
< a href="http://www.baidu.com"> a </a>
<h1> 定义标题的开始。
<h1 align="center"> 拥有关于对齐方式的附加信息。
<body> 定义 HTML 文档的主体。
<body bgcolor="yellow"> 拥有关于背景颜色的附加信息。
<table> 定义 HTML 表格。
<table border=""> 拥有关于表格边框的附加信息。
3、对属性的操作
(1)通过定位找到该元素存于变量中
var a = document.getElementById("id")
<head>
<title></title>
</head>
<body>
<input type ="button" value ="第一个按钮" class="c1" />
<input type ="button" value ="第二个按钮" class="c1" />
</body>
</html>
<script type="text/javascript">
var a = document.getElementsByClassName("c1")
a[].onclick = function () {
a[].setAttribute("disabled","disabled") // disable="disable" 不可用
}
a[].onclick = function () {
a[].removeAttribute("disabled")
}
</script>
例 2、 做一个问题,输入答案如果正确弹出正确,错误弹出错误
<head>
<title></title>
</head>
<body>
+=
<input type ="text" class="c1"/>
<input type ="button" value ="验证" " da="" class="c1"/>
</body>
</html>
<script type ="text/javascript">
var a = document.getElementsByClassName("c1");
a[].onclick = function () {
var c = a[].value;
var d = a[].getAttribute("da");
if (d == c)
alert("正确");
else
alert("笨蛋!!!");
}
</script>
效果
<head>
<title></title>
<style type="text/css">
.div {
width: 100px;
height: 100px;
background-color: red;
float: left;
margin-right: 10px;
}
</style>
</head>
<body>
<input type="button" value="验证" id="btn1" /><br />
<div class="div" aa=""></div>
<div class="div" aa=""></div>
<div class="div" aa=""></div>
<div class="div" aa=""></div>
<div class="div"></div>
<div class="div"></div>
</body>
</html>
<script type="text/javascript">
document.getElementById('btn1').onclick = function () {
var oDivs = document.getElementsByClassName('div');
for (var i = ; i < oDivs.length; i++) {
if (oDivs[i].getAttribute('aa') == '')
oDivs[i].style.backgroundColor = "blue";
if (oDivs[i].getAttribute('aa') == '')
oDivs[i].style.backgroundColor = "green";
}
}
</script>
效果图
JS DOM操作(三) Window.docunment对象——操作属性的更多相关文章
- JS DOM操作(二) Window.docunment对象——操作样式
一 对元素的定位 在 js 中可以利用 id.class.name.标签名进行元素的定位 id.class 用在客户端 name 用在服务端 用 id 定位 -- ...
- JS DOM操作(五) Window.docunment对象——操作元素
定位: var a = document.getElementByIt( "id" ) 同辈元素 var b = a.nextSibling; -- 找 a ...
- JS DOM操作(四) Window.docunment对象——操作内容
操作内容:即对标签所夹内容的操作 一 非表单元素内容操作 定位 var a = document.ElementById( "id" ) 1.获取内容 var s = a.inne ...
- JavaScript的DOM操作。Window.document对象
间隔执行一段代码:window.setlnteval("需要执行的代码",间隔毫秒数) 例 : window.setlnteval("alert("你 ...
- js switch判断 三目运算 while 及 属性操作
三 目运算:如var a = 10: var b= 12: c = a>b ?a:b; 若成立执行a否则执行b var isHide = true; 若用if判断语句如下 if(isHide) ...
- Python脚本控制的WebDriver 常用操作 <十七> 获取测试对象的属性及内容
测试用例场景 获取测试对象的内容是前端自动化测试里一定会使用到的技术.比如我们要判断页面上是否显示了一个提示,那么我们就需要找到这个提示对象,然后获取其中的文字,再跟我们的预期进行比较.在webdri ...
- JS中基本window.document对象操作以及常用事件!
一.找到元素 1.document.getELementById("id"):根据id找,最多找一个. var a=document.getELementById("id ...
- DOM操作(Window.document对象)
间隔与延迟: 间隔一段代码: window.setInterval("代码",间隔执行秒数) 延迟一段时间后执行一段代码: window.setTimeout("执行代码 ...
- AIR文件操作(二):使用文件对象操作文件和目录
转载于:http://www.flashj.cn/wp/air-file-operation2.html 文件对象是啥?文件对象(File对象)是在文件系统中指向文件或目录的指针.由于安全原因,只在A ...
随机推荐
- CentOS 7通过Firewall开放防火墙端口
发现在CentOS 7上开放端口用iptables没效果(或者是sodino没找到正确的命令,传说Centos7 下默认的防火墙是 Firewall,替代了之前的 iptables)… 使用firew ...
- Docker 持续集成初次体验
背景 在家的时候,实在不想做其他的,想起之前参加的一场关于docker的座谈会,于是想搞以下docker. 开始 在道客云上搞了一下持续集成,总体来说,比较好用的. 写了一个Go程序,就是之前写的发邮 ...
- 安装使用Entity Framework Power Tool Bate4 (Code First)从已建好的数据自动生成项目中的对应Model(新手贴,望各位大侠给予指点)
从开始学习使用MVC以后,同时也开始接触EF,很多原理都不是太懂,只知道安装了EF以后,点击哪里可以生成数据库对应的Model,不用再自己手写Model.这里记录的就是如何从已建立好的数据库生成项目代 ...
- cad.net之ACAD移植到GCAD的自动加载问题
将acad.pgp,lsp,fas,vlx,名称增加一份gcad.pgp,lsp,fas,vlx.涉及系统加载用. Lisp的拖拉加载在gcad无法通过lastprompt获取命令历史栏最后一行(含路 ...
- vue项目axios请求接口,后端代理请求接口404,问题出现在哪?
在vue项目中,列表数据需要用到qq音乐接口中的数据,但是直接请求不行,有host及referer限制,需要采用后端代理的方式.借助axios及node的express,在dev-server.js中 ...
- JS简单表单验证
这里我是写了一个简单的注册表单验证功能,亲测有效,一起来看看吧! 首先我的HTML代码是这样的: class大家可以忽略一下,这里我项目使用的是bootstrap的样式. 输入用户名和密码用的是正则表 ...
- .gitignore总结
git进行管理时,.gitignore是必不可少的,可以指定不需要提交到仓库的资源.最好在git init之后就创建 .gitignore文件,这是个好习惯,常用的配置及说明如下:
- 【转】如何用css限制文字长度,使溢出的内容用省略号…显示
文章转自这里(现在貌似被黑了,建议不要点击了) ps:因在该地方没看到转载按钮,复制下存到这里以待自己方便,别人能看到帮助一下更是乐意之至,效果亲测可以实现,兼容IE.谷歌.火狐 由于文字内容长度的不 ...
- 基于Django+celery二次开发动态配置定时任务 ( 一 )
需求: 前端时间由于开发新上线一大批系统,上完之后没有配套的报表系统.监控,于是乎开发.测试.产品.运营.业务部.财务等等各个部门就跟那饥渴的饿狼一样需要 各种各样的系统数据满足他们.刚开始一天一个还 ...
- String.format(String format,Object... args)的用法
String.format(String format, Object... args)方法详解 以前也看到过很多次这个用法,一直记不牢靠,今天整理一下. 我仅仅举几个例子稍做说明: String ...