HTML元素的属性

HTML元素的属性多以name="value”的形式出现；

常用的属性或者是大多数元素适用的属性有：id,class,style，tiltle;

id:给予元素唯一值，id值不可重复，

class:类值，一般是元素都具有共有样式时适用

style:给元素赋予内敛样式时适用，

title:规定元素的额外信息；

使用方式如下

<div id="content" class="content-syle" title="我是一个div" style="width:50px;height:89px;border:1px solid red"></div>

HTML5新增的属性有：contenteditable、contextmenu、data-*、draggable、dropzone、hidden、spellcheck、translate

contenteditable:规定元素是否可被编辑，值为true/false

contextmen:规定元素的上下文菜单。上下文菜单在用户点击元素时显示

data-*：规定元素的私有数据，-*一般是指，例如data-user-list、data-stu-style;是自定义的value值

draggable:元素是否可以拖动

dropzone:元素在拖动的时候被拖动数据时是否进行复制、移动或链接。（值未copy，move、link），目前所有的主流浏览器均不支持

hidden:元素是否隐藏 true/false true时隐藏

spellcheck:元素的拼写和语法检查

translate:规定是否翻译元素中的内容值未yes/no，目前的主流浏览器均无法正确的支持

<div contenteditable="true" spellcheck="true" id="testId" data-people-type="Children" draggable="true" lang="Chinese" hidden="hidden"></div>

注：获取元素的属性的js方式为：document.getElementId(‘testId‘).getAttribute(‘data-people-type‘)

设置属性：document.getElementId(‘testId‘).setAttribute(‘class‘,‘test‘)

原文地址：https://www.cnblogs.com/mamifeng/p/12579389.html

时间： 2024-10-15 20:18:27

HTML元素的属性的相关文章

jQuery学习笔记(4)-设置元素的属性和样式

一.前言本篇主要讲解如何使用jQuery获取和操作元素的属性和css样式二."DOM属性"与元素属性 1.运行一下代码 <img src="/images/logo_small.gif" class="img_logo" /> 2.分析代码元素属性src:/images/logo_small.gif 元素属性class:img_logo DOM属性currentSrc:http://localhost/images/logo_s

html5-了解元素的属性

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>了解元素的属性</title></head><body bgcolor="#f0f0f0"> <h1 align="center">静夜思</h1>

table的合并及各元素的属性

表格由 <table> 标签来定义.每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)注意<td>是行<tr>里的列下面介绍一下table中各元素的属性: 1.<table>:定义表格 2.<th>:表格中的表头 3.<tr>:定义表格的行 4.<td>定义表格的单元即行里的列 5.cellspacing:设置单元格的距离 6.cellpadding:设置

常用元素的属性/方法 attr / val / html /text

常用元素的属性/方法得到一个元素的高度, $("#myid").height() 得到一个元素的位置, $("#myid").offset() 返回的是一个offset对象, 如果取元素位置的top, 则$("#myid").offset().top,?取left则$("#myid").offset().left 得到一个元素的innerHTML, $("#myid").html() 得到一个元素的inn

使用jQuery操作元素的属性与样式

本文学习如何使用jQuery获取和操作元素的属性和CSS样式. 元素属性和Dom属性对于下面这样一个标签元素: <img id='img' src="1.jpg" alt='1' class="imgs"></img> 我们通常将id,src,alt,class称为属性,也即元素属性.但是,当浏览器对标签元素进行解析时,会将元素解析为Dom对象,相应的,元素属性也就解析为Dom属性. 元素属性和Dom属性只是在我们对其进行不同解析时的不同

javascript操作html元素CSS属性

下面先记录一下JS控制CSS所使用的方法. 1.使用javascript更改某个css class的属性... <style type="text/css"> .orig { display: none; } </style> 你想要改变把他的display属性由none改为inline. 解决办法: 在IE里: document.styleSheets[0].rules[0].style.display = "inline"; 在firef

Html5学习笔记1 元素标签属性

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML5学习笔记</title> </head> <body bgcolor="#90ee90"> 1.Html5的元素<br/><br/> 元素指的是从開始标签到结束标签的全部代码<

XStream-->别名;元素转属性;去除集合属性(剥皮);忽略不需要元素

--->清单: City.java Province.java TestXStream.java 4个XStream方法的效果图 javabean-->City.java 1 package xstream; 2 3 public class City { 4 private String name; 5 private String description; 6 7 public String getName() { 8 return name; 9 } 10 public void set

jquery设置和获取元素的属性

jquery设置和获取元素的属性: 使用jquery可以方便的设置指定元素的属性,下面就以div元素为例子做一下简单介绍. 代码实例如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.51texiao.cn/" /> <title>蚂蚁

利用js_API 执行对html文档元素的属性的CRUD操作

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>对html元素属性的增删改查操作</title> <style> #attr{text-align:center;font-size:24px;color:white;background:#008000;width:400px;height:30px; } .myclass{back