id和class的区别
id和class是定义css样式用到的,不同的是定义样式时的写法不一样,使用id选择样式时,定义的格式为 #main{width:20px;} ,使用class时用到的是 .main{width:20px;}
id重复使用在应用到js的时候可能会产生错误(当js代码中用到这个id的时候),没有规定不能重复使用。
HTML name、id、class 的区别
在一个页面中,有许多的控件(元素或标签)。为了更方便的操作这些标签,就需要给这些标签标识一个身份牌。
目录
1. name :指定标签的名称。
2. id :指定标签的唯一标识。
3. class :指定标签的类名。
1. name
指定标签的名称。
1.1 格式
<input type="text" name="username" />
1.2 应用场景
①form表单:name可作为转递给服务器表单列表的变量名;如上面的传到服务器的名称为:username='text的值'。
②input type='radio'单选标签:把几个单选标签的 name设为一个相同值时,将会进行单选操作。
<input type="radio" name='sex'/>男
<input type="radio" name='sex'/>女
③快速获取一组name相同的标签:获取拥有相同name的标签,一起进行操作,如:更改属性、注册事件等。
function changtxtcolor() {
var txts = document.getElementsByName('txtcolor'); //获取所有name=txtcolor 的标签
for (var i = 0; i < txts.length; i++) { //循环遍历标签,并把背景色改为red
txts[i].style.backgroundColor = 'red';
}
}
1.3 特性
name属性的值,在当前page页面中并非唯一性。
2. id
指定标签的唯一标识。
2.1 格式
<input type=password id="userpwd" />
2.2 应用场景
①根据提供的唯一id号,快速获取标签对象。如:document.getElementById(id)
②用于充当label标签for属性的值:示例:<label for='userid'>用户名:</label>,表示单击此label标签时,id为userid的标签获得焦点。
2.3 特性
id属性的值,在当前的page页面要是唯一的。
3. class
指定标签的类名。
3.1 格式
<input type=button class="btnsubmit" />
3.2 应用场景
①CSS操作,把一些特定样式放到一个class类中,需要此样式的标签,可以在添加此类。
3.3 特性
可以把多个类,放在一个class属性里,但必须用空格隔开;如:class='btnsubmit btnopen'
id和class的区别的更多相关文章
- html元素中id和name的区别
可以说几乎每个做过Web开发的人都问过,到底元素的ID和Name有什么区别阿?为什么有了ID还要有Name呢?! 而同样我们也可以得到最classical的答案:ID就像是一个人的身份证号码,而Nam ...
- html中元素的id和name的区别(2016-1-22)
HTML中元素的Id和Name属性区别 一直以来一直以为在html中,name和id没什么区别,今天遇到一个坑才发现(PHP获取不到表单数据,原因:元素没有name,只定义了id),这两者差别还是很大 ...
- form表单中的id 与name的区别
以前经常写form表单时,不写id和name,总觉得没有什么用.后来一看后台套完的页面发现,他们都补上name,不知道所以然,就查了一下资料,吓我一跳,要是照我那样写根本不会有数据传到服务器.原来表单 ...
- javascript querySelector和getElementById通过id获取元素的区别
querySelector和getElementById通过id获取元素的区别 <!DOCTYPE html> <html> <head> <meta cha ...
- form表单中id与name的区别
以前经常写form表单时,不写id和name,总觉得没有什么用.后来一看后台套完的页面发现,他们都补上name,不知道所以然,就查了一下资料,吓我一跳,要是照我那样写根本不会有数据传到服务器.原来表单 ...
- ID和Name的区别
HTML元素的ID和Name属性的区别一直认为ID和NAME是一样的,两个又可以一起出现,甚是疑惑.今天BAIDU了一下,才发现里面大有文章.发出来研究研究:最classical的答案:ID就像是一个 ...
- Spring中applicationContext.xml的bean里的id和name属性区别
转自:http://www.cnblogs.com/ztf2008/archive/2009/02/11/1388003.html <beans><bean id="per ...
- meta name id class 标签的区别
meta https://zhidao.baidu.com/question/2052283721385566387.html name 跟 id 的区别 http://blog.csdn.net/f ...
- css常用属性总结之 id和class的区别,使用类还是ID?
前面两篇文章我们分别谈到了class和id的相关知识和如何使用,但是在实际项目中,我们该如何抉择,class还是id? 先回顾下两者的区别吧! 1.id具有唯一性,class具有普遍性,所以一个页面同 ...
随机推荐
- Windows环境安装MySQL8.0.11
网络开发数据库是必不可少的.曾经安装个Mysql,但是忘了.再次安装还是得百度.那还不如自己写篇博客记录一下呢,以后再忘记就看自己的博客好 Mysql官网安装地址(windows环境): https: ...
- 关于php文件操作的几个小trick
记录一些ctf题目中近期遇到的一些文件操作trick,不定时更新 1.move_uploaded_file 一般用来保存上传的文件,第二个参数一般是最终保存的文件名,针对此函数,若在一定条件下$new ...
- ubuntu 安装eclipse for c++
linux的GUI和windos比起来实在逊色,虽然它的终端模式(命令行模式)非常强大.linux发行版ubuntu的GUI相对其他版本要华丽一些,所以最近由redhat转向ubuntu进行linux ...
- 剑指offer35----复制复杂链表
题目: 请实现一个cloneNode方法,复制一个复杂链表. 在复杂链表中,每个结点除了有一个next指针指向下一个结点之外,还有一个random指向链表中的任意结点或者NULL. 结点的定义如下: ...
- 深度解析 Qt 中动态链接库
本文介绍的是Qt 中动态链接库,现在有些软件有自动升级功能,有些就是下载新的DLL文件,替换原来的动态链接库,MFC好象也有类似机制,Qt还有一种方式,就是把一个QWidget子类,编译成动态链接库. ...
- socket.io 的使用
socket.io 是对 websocket 的封装,当你在客户端使用 socket.io 那么服务器也要对应的使用 目录结构: 使用方法: 客户端: socket.emit() 是提交数据,sock ...
- Docker Image
Docker 对 container 的使用基本是建立在 LXC 基础之上,然而 LXC 存在的问题是难以移动,难以通过标准化的模板去制作.重建.复制和移动 container. 在以 VM 为基础的 ...
- Ubuntu14.04+安卓系统4.3+JDK6编译源码
本博客主要参照: https://www.jianshu.com/p/ecb9c132030f https://blog.csdn.net/gobitan/article/details/243674 ...
- CentOS 7系统配置上的变化
http://www.linuxidc.com/Linux/2014-09/107375p4.htm CentOS 7系统配置上的变化解析 ip ss指令替代 ifconfig route arp n ...
- linux简单命令9--yum安装软件
+