js更改html样式及属性

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function les(){
var a=document.getElementsByName("one");
var b=document.getElementsByTagName("input");
for(var i=0;i<b.length;i++){
 b[i].readOnly="readonly";
}
}
function les1(){
var b=document.getElementsByTagName("input");
for(var i=0;i<b.length;i++){
 b[i].readOnly=false;
 b[i].style.background="#00";
}
}
</script>
</head>

<body >

<input type="text"  name="one"  style="background:;" />
<input type="text"  name="one" />
<input type="button" onclick="les()" />
<input type="button" onclick="les1()" />
</body>
</html>

时间: 2024-09-15 03:51:37

js更改html样式及属性的相关文章

JS 对html标签的属性的干预以及JS 对CSS 样式表属性的干预

-任何标签的任何属性都可以修改! -HTML里是怎么写, JS就怎么写 以下是一段js 作用于 css 的 href的 代码 <link id="l1" rel="stylesheet" type="text/css" href="css1.css" /> <script> function skin1() { var oL=document.getElementById('l1'); oL.href=

JS 控制CSS样式表

JS控制CSS样式,首先得确定一点,CSS与HTML页面的链接方式,因为CSS有3种与HTML页面结合的方式,不同的方式也会产生不同的结果. 下面先记录一下JS控制CSS所使用的方法. 1.使用javascript更改某个css class的属性... 1 <style type="text/css"> 2 .orig { 3 display: none; 4 } 5 </style> 你想要改变把他的display属性由none改为inline. 解决办法:

js操纵css样式

操作元素的Style样式属性 1.格式对比: 演示代码: css样式属性: background-color color font font-family font-weight ..... JS样式属性: style.backgroundColor style.color style.font style.fontFamily style.fontWeight ..... 2.使用DOM的style对象 javascript样式表分为:内嵌式样式表:内联式样式表:外联式样式表. 操作元素的st

“高三”笔记之动态JS、动态样式

拜读<JavaScript高级程序设计> --- 站在巨人的肩上 动态JS.动态样式就是页面加载时不存在,但将来通过DOM操作动态添加的脚本:包括加载外部文件和添加内部代码块两种:动态加载的外部文件能够立即运行,而动态添加的代码块却不能如愿的立即执行:下面将主要以JS为例,小小的探索下动态脚本的加载.执行以及jQuery的做法.Angularjs的相关做法: 1.动态加载外部文件 因为动态加载的外部JS会立即执行,也没什么浏览器兼容性问题,这个好处理:这里的重点是怎么知道脚本已加载完成呢?呵呵

js操作元素样式

样式表有外部样式表.内部样式表.行内样式. js改变css样式也是有三种.针对于外部样式表如果不采用后台技术,只是单纯的用js是不能实现的.所以下面只讨论两个方法. 一.js改变内部样式 其操作方法和一般标签一样,给style标签加一个类名或id,然后js中获取该元素,向里面添加内容即可改变样式. 示例: 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UT

jQuery - 02. 样式表属性操作/类操作、动画、显示隐藏、滑入、淡入、停止动画、节点操作、添加对象、清空节点

样式表属性操作.css $("div").css({'width':100,'height':100,'background':'red'}); $("div").css("background","pink"); 类操作 .addClass添加类   $("div").addClass("class"); .removeClass删除类   $("div).removeCla

jQuery-介绍 加载 选择器 样式操作 属性操作 绑定click事件

jQuery - 介绍 加载 选择器 样式操作 属性操作 绑定click事件 注意:以下部分问题不能实现效果,因该是单词拼写错误(少个t)或者没有加引号(“swing”)... jquery介绍 jQuery是目前使用最广泛的javascript函数库.据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库.微软公司甚至把jQuery作为他们的官方库. jQuery的版本分为1.x系列和2.x.3.x系列,1.x系列兼容低版本的浏览器,2.x.3.x系列放弃支持低版本浏览器

用JS读写CSS样式的方法总结

为了日后方便查询,本人翻阅了一些资料总结了以下方法,如有不对的地方欢迎指出! 一.可以通过DOM节点对象的style对象(即CSSStyleDeclaration对象)来读写文档元素的CSS样式    如:var elm = document.getElementById('test'); elm.style.color = 'black'; 二.通过Element对象的getAttribute().setAttribute().removeAttribute()直接读写style属性    如

用原生JS读写CSS样式的方法总结

一.可以通过DOM节点对象的style对象(即CSSStyleDeclaration对象)来读写文档元素的CSS样式    如:var elm = document.getElementById('test'); elm.style.color = 'black'; 二.通过Element对象的getAttribute().setAttribute().removeAttribute()直接读写style属性    如:elm.setAttribute('style','color:red;li