`
heichong
  • 浏览: 45624 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

如何用js给html表单设置style

HTMLCSSJavaScript 
阅读更多 
关键字: 用js给html表单设置style 
首先，把CSS和JS标签style属性对照表了解了：

CSS 和 JavaScript 标签 style 属性对照表：

 

盒子标签和属性对照 
CSS语法（不区分大小写）		JavaScript语法（区分大小写） 
border				border 
border-bottom			borderBottom 
border-bottom-color		borderBottomColor 
border-bottom-style		borderBottomStyle 
border-bottom-width		borderBottomWidth 
border-color			borderColor 
border-left			borderLeft 
border-left-color		borderLeftColor 
border-left-style		borderLeftStyle 
border-left-width		borderLeftWidth 
border-right			borderRight 
border-right-color		borderRightColor 
border-right-style		borderRightStyle 
border-right-width		borderRightWidth 
border-style			borderStyle 
border-top			borderTop 
border-top-color		borderTopColor 
border-top-style		borderTopStyle 
border-top-width		borderTopWidth 
border-width			borderWidth 
clear				clear 
float				floatStyle 
margin				margin 
margin-bottom			marginBottom 
margin-left			marginLeft 
margin-right			marginRight 
margin-top			marginTop 
padding				padding 
padding-bottom			paddingBottom 
padding-left			paddingLeft 
padding-right			paddingRight 
padding-top			paddingTop 

颜色和背景标签和属性对照	 
CSS 语法（不区分大小写）	 JavaScript 语法（区分大小写） 
background			background 
background-attachment		backgroundAttachment 
background-color		backgroundColor 
background-image		backgroundImage 
background-position		backgroundPosition 
background-repeat		backgroundRepeat 
color				color 
  
样式标签和属性对照 
CSS语法（不区分大小写）		JavaScript 语法（区分大小写） 
display				display 
list-style-type			listStyleType 
list-style-image		listStyleImage 
list-style-position		listStylePosition 
list-style			listStyle 
white-space			whiteSpace 
  
文字样式标签和属性对照 
CSS 语法（不区分大小写）	 JavaScript 语法（区分大小写） 
font				font 
font-family			fontFamily 
font-size			fontSize 
font-style			fontStyle 
font-variant			fontVariant 
font-weight			fontWeight 
  
文本标签和属性对照 
CSS 语法（不区分大小写）	 JavaScript 语法（区分大小写） 
letter-spacing			letterSpacing 
line-break			lineBreak 
line-height			lineHeight 
text-align			textAlign 
text-decoration			textDecoration 
text-indent			textIndent 
text-justify			textJustify 
text-transform			textTransform 
vertical-align			verticalAlign 
 



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
 </HEAD>
<script language="javascript">
function validate(){
      if (document.all("name").value == ""){
			document.all("name").style["borderColor"]="red";//就是这里
			return;
		}
}
</script>
 <BODY>
  <input type="text" name="name" >
 </BODY>
</HTML>
分享到：
| Select列表框交换数据
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    【前端】利用HTML标签 实现简单用户登录界面【HTML+CSS+JavaScript(JS)】

    本文将详细讲解如何使用HTML、CSS和JavaScript（JS）这三种核心技术来实现一个简单的用户登录界面。 首先，HTML（HyperText Markup Language）是网页的基础结构语言，用于定义页面的内容和布局。在实现登录界面时，...

    利用JS+CSS实现滚动表格数据展示

    接着，我们用CSS来设置表格的样式，特别是滚动条的样式。CSS允许我们定制滚动条的外观，使其与页面设计更加融合。以下是一些基本的CSS样式： ```css #scrollTable { width: 100%; overflow-y: auto; scrollbar-...

    js下用层来实现select的title提示属性.docx

    首先，我们创建一个div元素，并将其style.zIndex设置为100，以便将其置于select控件之上。然后，我们创建一个table元素，并将其style.zIndex也设置为100。接下来，我们获取select控件的宽度、高度、左边距和上边距，...

    form表单action提交的js部分与html部分

    一个标准的HTML表单通常包含以下结构： ```html &lt;form style="padding:10px 8px;" method="post" action="" id="fm1" name="fm1"&gt; &lt;div style="margin-bottom:10px;"&gt; &lt;span style="padding-right:10px;"&gt;标题: ...

    零基础学HTML CSS源代码

    如何用DIV布局.html 演示如何用DIV布局。 第13章（源代码\第13章） 示例描述：本章演示DIV与SPAN用法。 SPAN基本语法.html SPAN基本语法。 何时该用SPAN.html 何时该用SPAN。 DIV与SPAN区别一....

    许愿墙HTMLcssjs

    例如，可以创建一个`&lt;form&gt;`标签来设计用户输入愿望的表单，用`&lt;input&gt;`标签提供文本输入区域，以及`&lt;button&gt;`标签创建提交愿望的按钮。此外，可能还需要使用`&lt;div&gt;`元素来创建容器，以便对内容进行分组和定位。 接...

    APP点餐系统，HTML,JS,CSS编写。适用于iphone

    由于“压缩包子文件的文件名称列表”中只给出了“APP点餐系统HTML”，我们可以推测这个压缩包包含的是HTML源代码，可能还包括CSS和JS文件，以及其他资源如图片、字体等。开发者可能将这些文件结构化地组织在不同的...

    大名鼎鼎SWFUpload- Flash+JS 上传

    一些可用的演示展示了它能够完成什么事情以及它是如何完成这些常见的任务。 SWFUpload由4部分组成： 初始化和设置 JavaScript 库: SWFUpload.js Flash控制元素: SWFUpload_f8.swf 或者 SWFupload_f9.swf 事件...

    巧用js提交表单轻松解决一个页面有多个提交按钮

    `onclick`事件将按钮的`this`（即按钮元素本身）传递给`check`函数，以便函数内部可以根据按钮的具体`value`值来决定如何设置表单的`action`属性，进而影响表单的提交行为。 需要注意的是，在使用DWR时，由于DWR...

    HTML+CSS+JS实现动漫网站

    此外，还可以用JavaScript处理表单提交，验证用户输入，或者实现搜索功能，让用户能够快速找到喜欢的动漫。对于描述中的“js操作”，可能涉及到的是JavaScript事件监听器、定时器（setTimeout或setInterval）以及DOM...

    js控制表单奇偶行样式的简单方法

    本篇将详细介绍如何使用JavaScript（JS）和jQuery来实现这一功能，特别是控制表单奇偶行的样式。 首先，如果你的项目已经引入了jQuery库，那么控制奇偶行的样式会非常简洁。jQuery提供了`:odd`和`:even`选择器，...

    js实现点击弹出层并定位赋值

    下面我们将详细探讨如何实现这一功能。 首先，我们需要创建HTML结构，包括表格（table）和弹出层（popup layer）。表格中的每个TD单元格应该有一个点击事件监听器，当用户点击时，弹出层会出现并显示相关信息。弹出...

    使用js实现关闭js弹出层的窗口

    本文将详细探讨如何使用JavaScript实现关闭JS弹出层窗口的方法。 首先，我们要了解什么是弹出层。弹出层通常指的是在用户操作后突然出现在网页上的一个元素，如提示信息、表单或广告等，它们通常是通过改变CSS的`...

    JS控制文本域只读或可写属性的方法

    下面的javascript代码片段演示了如何使用`getElementById`方法获取页面中元素的引用，并根据复选框的选中状态来动态设置文本域的`readonly`和`disabled`属性： ```javascript // 定义一个函数changeCheck用于切换...

    net架构练习题

    - **问题**: 如何在HTML页面中引入在同一目录下的“my.js”文件？ - 虽然题目没有给出完整的选项，但在HTML中引入JavaScript文件的标准写法是： ```html &lt;script src="my.js"&gt; ``` - 这里使用`src`属性来指定...

    BinaryHeart的网站，这是一个课后俱乐部，负责修复捐赠的技术并将这些设备重新捐赠给低收入学校_HTML_CSS_.zip

    4. JavaScript文件：如果网站包含交互性功能，如表单提交、动态效果或者轮播图，那么`.js`文件就至关重要。JavaScript可以增加网站的动态性和用户体验。 5. 其他文件和目录：可能包括`fonts`目录来存储自定义字体，...

    韩顺平PHP JS JQUERY 所有视频下载种子 货真价实

    9-28 7 给对象指定成员函数 自定义工厂方法 9-30 1 课程回顾 9-30 2 javascript的闭包 js变量作用域 9-30 3 仿超级玛丽兄弟游戏制作 9-30 4 构造方法 对象的常用操作 9-30 5 面向对象的封装 继承 多态 9-30 6 面向...

    网站商城一个辅助的充值用的代码

    `说明.txt`文件可能是对整个充值流程或代码实现的详细说明，包括如何集成此代码到现有商城系统中，以及如何处理充值请求、验证支付安全和更新用户账户余额等步骤。 `访问代码笔记.url`是一个快捷方式，可能指向一个...

    我的个人网页

    3. JavaScript基础：了解如何用JavaScript添加交互功能，如按钮点击事件、表单验证等。 4. 文件组织：学习如何合理地组织网页项目中的文件和目录，以便于管理和维护。 5. 浏览器兼容性：理解不同浏览器可能对HTML、...

Magicbox
Global site tag (gtag.js) - Google Analytics