CSS-DOM
在所有的产品设计中,选择最适用的工具去解决问题是最基本的原则。
①使用(X)HTML去搭建文档的结构。
②使用CSS 去设置文档的呈现效果。
③使用DOM脚本去实现文档的行为。
文档中的每个元素都是一个对象,每个元素都有一个style属性,它们是一个对象。
样式都存放在style对象的属性里:element.style.property;
使用style对象的color属性:element.style.color;
减号和加号之类的操作符是保留支付,不允许用在函数或者变量的名字里。这同时意味着它们也不能用在方法或属性的名字里。当你需要引用一个中间带减号的CSS属性的时候,DOM要求你用驼峰命名法。CSS属性font-family变为DOM属性fontFamily:element.style.fontFamily;
内嵌样式:通过style属性获取样式有很大的局限性。style属性只能返回内嵌样式。只有把CSS style属性插入到标记里,才可以用DOM style属性去查询那些信息。
在外部样式表里声明的样式不会进入style对象,style对象只包含在HTML代码里用style属性声明的样式。
style对象可以用来更新样式:
element.style.property=value;
style对象的属性值永远是一个字符串。
style对象的属性的值必须放在引号里,单引号或双引号均可。
只要有可能,最好选用CSS为文档设置样式。
如果想要改变某个元素的呈现效果,使用CSS;如果想要改变某个元素的行为,使用DOM;
className属性:className属性是一个可读/可写的属性,凡是元素节点都有这个属性。
可以用className属性得到一个元素的class属性:element.className;
用className属性和赋值操作符设置一个元素的class属性:element.className=value;
把一个非常具体的东西改进为一个较为通用的东西的过程叫做抽象。
CSS-DOM的更多相关文章
- dom core,html dom,css dom,jquery 中的dom操作
前端开发中为达到某种目的,往往有很多方法:dom core,html dom,jquery; dom core/jquery主要通过函数调用的方式(getAttribute("属性名&quo ...
- [CSS] DOM Hierarchy Pseudo Classes :first-child :last-child :nth-child (demystified)
DOM hierarchy pseudo-classes allow you to style specific elements based on where they fall in the hi ...
- Html,Css,Dom,javascript细节总结
最近愈发觉得基础的重要性,细节决定成败,所以希望能够将自己注意到的搜集到的一些关于前端的小细节小知识整理出来,更好的方便自己记忆回顾. 1.在构建网页Html框架时,尽量只给外层标记(即是父标记)定义 ...
- html+css+dom补充
补充1:页面布局 一般像京东主页左侧右侧都留有空白,用margin:0 auto居中,一般.w. <!DOCTYPE html> <html lang="en"& ...
- CSS - DOM 经常使用方法
offset() 方法返回或设置匹配元素相对于文档的偏移(位置). 包括两个属性值:top,left. position() 方法返回匹配元素相对于父元素的位置(偏移). 包括两个属性值:top,le ...
- jQuery基础DOM和CSS操作
$('#box').html();//获取 html 内容$('#box').text();//获取文本内容,会自动清理 html 标签$('#box').html('<em>www.li ...
- 基础DOM和CSS操作(一)
DOM简介 DOM是一种文档对象模型,方便开发者对HTML结构元素内容进行展示和修改.在JavaScript中,DOM不但内容庞大繁杂,而且我们开发的过程中需要考虑更多的兼容性.扩展性.在jQuery ...
- Jquery5 基础 DOM 和 CSS 操作
学习要点: 1.DOM 简介 2.设置元素及内容 3.元素属性操作 4.元素样式操作 5.CSS 方法 DOM 是一种文档对象模型.方便开发者对HTML 结构元素内容进行展示和修改.在 JavaScr ...
- 第一百六十六节,jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度、偏移、滚动条
jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度.偏移.滚动条 学习要点: 1.DOM 简介 2.设置元素及内容 3.元素属性操作 4.元素样式操作 ...
- HTML、css、javascript、DOM编程
HTML.css.javascript.DOM编程 一.Html 1.1html概述 Html就是超文本标记语言的简写,是最基础的网页语言,其代码都是由标签所组成,是通过标签来定义的语言,代码不需要区 ...
随机推荐
- GET和POST区别和用法
很多人都分不清GET与POST的区别,以及什么时候用GET?什么时候用POST? GET和POST两种方法都是将数据送到服务器,但你该用哪一种呢? HTTP标准包含这两种方法是为了达到不同的目的.PO ...
- XtraReport三动态数据绑定
代码还用上一节的,把Report的Datasource去掉.各个绑定的字段也去掉,有了第二节的基础,现在看这个就不难了,无非就是传到report一个数据集,在把这个数据集绑定到各控件里 清空detai ...
- IsBackground对线程的重要作用
要点: 1.当在主线程中创建了一个线程,那么该线程的IsBackground默认是设置为FALSE的. 2.当主线程退出的时候,IsBackground=FALSE的线程还会继续执行下去,直到线程执行 ...
- maven课程 项目管理利器-maven 1-1课程概述
1 为什么使用maven? 多框架应用项目,jar包太多且冲突,为了解决这个问题,引入maven.(类似还有ant,gradle) 2 课程概述 maven快速入门 maven核心知识 maven建造 ...
- Flask文件目录----- db文件
import sqlite3 import click from flask import current_app, g from flask.cli import with_appcontext d ...
- 好用的切换滑动焦点图框架jquery.superslide
拿到学习网站:http://www.superslide2.com/
- 【工作中学习2】Map的使用及排序(第三个参数)
项目进行中,使用到Map(std::map),Map要点整理如下: 1. Map,也叫关联数组,提供key/value(键/值对),key用来索引,value是被存储和检索的数据. 2. key值唯一 ...
- adobe air ane 中有的java class 打包 apk 后却没有了报NoClassDefFoundError ,ClassNotFoundException
apache flex sdk 手机项目 09-18 10:34:55.030: E/AndroidRuntime(19513): FATAL EXCEPTION: main 09-18 10:34: ...
- 浅谈SQL Server中的事务日志(二)----事务日志在修改数据时的角色
简介 每一个SQL Server的数据库都会按照其修改数据(insert,update,delete)的顺序将对应的日志记录到日志文件.SQL Server使用了Write-Ahead logging ...
- Mat转化为IplImage类型的方法
Mat image_mat; IplImage imgTmp = image_mat; IplImage *img = cvCloneImage(&imgTmp);