HTML DOM 层级

HTML中DOM对象的属性和方法的层级关系是怎样的？（目录即层次）

HTML中DOM对象的属性和方法的层级关系是怎样的?(目录即层次) 一.总结一句话总结:目录就是测试题 1.document取得元素(get element)的方式有哪几种? 解答:四种,分别是id,name,calss,tagName.getElementById,getElementsByName,getElementsByClassName,getElementsByTagName. 2.js中的方法用的是什么命名法(便于如何写函数名)? 解答:驼峰命名法,getElementById,

【使用 DOM】使用 DOM 元素

1. 使用元素对象 HTMLElement对象提供了一组属性,可以用它们来读取和修改被代表的数据.下表介绍了这些属性. 下面代码展示了如何使用表中所列的一些基本属性. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>使用基本元素数据属性</title> <style> p {border: m

【温故而知新-Javascript】使用 DOM 元素

1. 使用元素对象 HTMLElement对象提供了一组属性,可以用它们来读取和修改被代表的数据.下表介绍了这些属性. 下面代码展示了如何使用表中所列的一些基本属性. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>使用基本元素数据属性</title> <style> p {border: m

Angular4.x Event (DOM事件和自定义事件)

Angular组件和DOM元素通过事件与外部进行通信,两者中的事件绑定语法是相同的-(eventName)="expression": <button (click)="onClick()">Click</button> DOM元素 DOM 元素触发的一些事件通过 DOM 层级结构传播,事件首先由最内层的元素开始,然后传播到外部元素,直到它们到根元素,这种传播过程称为事件冒泡. DOM事件冒泡与Angular可以无缝工作,具体示例如下: im

Twproject Gantt开源甘特图功能扩展

1.Twproject Gantt甘特图介绍 Twproject Gantt 是一款基于 jQuery 开发的甘特图组件,也可以创建其它图表,例如任务树(Task Trees).内置编辑.缩放和 CSS 皮肤等功能.更重要的是,它是免费开源的. 官网地址是:https://gantt.twproject.com/ 源码可以从github下载: 2.扩展功能一:code自动层级编码,满足wbs编码要求工作分解结构 (WBS) 代码是项目的识别您的分级显示结构中的每个任务的唯一位置的字母数字代码.

响应式web网站设计制作方法

在研究响应式的时候,记录了一些感想,分享出来,抛砖引玉,希望可以和大家一起讨论.总结下来,响应式比之前想象的要复杂得多.1. ie9以下(不包括ie9)采用ie条件注释,为ie8以及一下单独开一个样式文件 1  2. 一个模块的mq样式

FreeMarker模板开发指南知识点梳理

freemarker是什么? 有什么用? 怎么用? (问得好,这些都是我想知道的问题) freemarker是什么? FreeMarker 是一款模板引擎: 即一种基于模板和要改变的数据, 并用来生成输出文本(HTML网页,电子邮件,配置文件,源代码等)的通用工具. 它不是面向最终用户的,而是一个Java类库,是一款程序员可以嵌入他们所开发产品的组件. 对于像我一样之前完全对freemarker没概念的来说,这种解释还是无法释疑解惑,需要说的再详尽点. freemarker有什么用? 模板编写

CSS篇

一.盒子模型: 标准模式和混杂模式(IE).在标准模式下浏览器按照规范呈现页面:在混杂模式下,页面以一种比较宽松的向后兼容的方式显示.混杂模式通常模拟老式浏览器的行为以防止老站点无法工作. CSS盒子模型具有内容(content).填充(padding).边框(border).边界(margin)这些属性.我们所说的width,height指的是内容(content)的宽高,一个盒子模型的宽度=:width+ pdding(宽) + border(宽),高度=height + padding(高

Node.js的学习--使用cheerio抓取网页数据

打算要写一个公开课网站,缺少数据,就决定去网易公开课去抓取一些数据. 前一阵子看过一段时间的Node.js,而且Node.js也比较适合做这个事情,就打算用Node.js去抓取数据. 关键是抓取到网页之后如何获取到想要的数据呢?然后就发现了cheerio,用来解析html非常方便,就像在浏览器中使用jquery一样. 使用如下命令安装cheerio npm install cheerio Cheerio安装完成, 我们就可以开始工作了. 首先让我们来看一段javascript代码这段代码可以下

AngularJS讲义-控制器

在Angular中,控制器(Controller)就是基于JavaScript的构造方法,主要用来构造模型并建立模型和视图之间的数据绑定.控制器里面定义了应用程序的逻辑和行为. 通过ng-controller指令可以将控制器和DOM绑定起来.Angular会用定义过的控制器构造函数实例化一个控制器对象,在Angular应用(module)启动的时候,会创建一个根作用域, Angular实例化每个控制器时会创建一个新的子作用域并作为可注入参数($scope)注入到控制器的构造方法中. 在理解控制器

关于页面 reflow 和 repaint

什么是 reflow 和 repaint 浏览器为了重新渲染部分或整个页面,重新计算页面元素位置和几何结构(geometries)的进程叫做 reflow. 当确定了元素位置.大小以及其他属性,例如颜色.字体大小等都确定下来后,浏览器于是便把这些元素都按照各自的特性绘制了一遍,于是页面的内容出现了,这个过程称之为 repaint. 当修改一个元素的外观(例如 outline.visibility.background color 等)但并不影响到元素的布局时,就会发生 repaint. repa

CSS隐藏元素的几种方法

使用CSS隐藏元素的方法很多,在这里简单总结一下: 1.display:none display:none 应该是最常用的一种隐藏元素的方法,使用该方法隐藏的元素脱离文档流不占据空间,不会被浏览器解析,不能点击,搜索引擎可能会认为被隐藏的文字属于垃圾信息而被忽略,而且屏幕阅读器(是为视觉上有障碍的人设计的读取屏幕内容的程序)会忽略被隐藏的文字. 2.visibility:hidden 使用 visibility:hidden 隐藏的元素,不能点击,但是会占据文档空间,不够灵活,一般配合 posi

node cheerio

所谓工欲善其事,必先利其器,所以通读了cheerio的API,顺便翻译了一遍,有些地方因为知道的比较少,不知道什么意思,保留了英文,希望各位不吝告诉我,然后一起把这个翻译完成. ###cheerio 为服务器特别定制的,快速.灵活.实施的jQuery核心实现. ###Introduction 将HTML告诉你的服务器 var cheerio = require('cheerio'), $ = cheerio.load('<h2 class="title">Hello wor

提高Web页面性能的技巧

现在动辄几兆大小的页面加载量,让性能优化成了不可避免的热门话题.WEB 应用越流畅,用户体验就会越好,继而带来更多的访问量.这也就是说,我们应该反省一下那些过度美化的 CSS3 动画和多重操作的 DOM 元素是否都考虑到了在性能方面的影响.在说性能优化之前,我们有必要理清浏览器视觉绘制方面的两个术语: Repaint(重绘):如果某些操作影响了 DOM 元素的可见性,但又没有影响布局,那么就会发生浏览器的重绘,比如opacity,background-color,visibility 和 out

【cheerio】nodejs的抓取页面模块

http://baike.baidu.com/link?url=8V1CZsEzNE05ujOzISquom_pvFj16sWu1rRb8js11pmd9HNq7ePW_aKfG9oyXj6Txuu5K_KVpDDmX7_PwQJdz_ 获得和修改属性 .attr(name,value) 获得和修改属性.在匹配的元素中只能获得第一元素的属性.如果设置一个属性的值为null,则移除这个属性.你也可以传递一对键值,或者一个函数. $('ul').attr('id') //=> fruits $(

css的repaint和reflow

css的repaint和reflow 浏览器为了重新渲染部分或整个页面,重新计算页面元素位置和几何结构(geometries)的进程叫做 reflow. 由于 reflow 是一种浏览器中的用户拦截(user-blocking)操作,所以了解如何减少 reflow 次数,及不同的文档属性(DOM 层级(DOM depth),CSS 效率,不用类型的 style 变化)对 reflow 次数的影响对开发者来说非常必要.有时 reflow 页面中的一个元素会 reflow 它的父元素(译注:这里是复

HBuilder的webview操作

HBuilder的webview操作 webviewAPI文档:http://www.html5plus.org/doc/zh_cn/webview.html 创建新的webview窗口: WebviewObject plus.webview.create( url, id, styles, extras ); 说明:创建Webview窗口,用于加载新的HTML页面,可通过styles设置Webview窗口的样式,创建完成后需要调用show方法才能将Webview窗口显示出来. 显示Webvie

跨平台移动端APP开发---简单高效的MUI框架

MUI是dcloud(数字天堂)公司旗下的一款跨平台开发移动APP的框架产品,在学习MUI框架之前,最先接触了Hbuilder代码编辑器,它带给我的第一感觉是快,这是HBuilder的最大优势,通过完整的语法提示和代码输入法.代码块等,大幅提升HTML .JS.css的开发效率. 01-初识MUI MUI 有以下两大亮点: 一.轻量追求性能体验,是我们开始启动MUI项目的首要目标,轻量必然是重要特征: MUI不依赖任何第三方JS库,压缩后的JS和CSS文件仅有100+K和60+K 二.原

通读cheerio API ——NodeJs中的jquery

通读cheerio API ——NodeJs中的jquery 所谓工欲善其事,必先利其器,所以通读了cheerio的API,顺便翻译了一遍,有些地方因为知道的比较少,不知道什么意思,保留了英文,希望各位不吝告诉我,然后一起把这个翻译完成. ###cheerio 为服务器特别定制的,快速.灵活.实施的jQuery核心实现. ###Introduction 将HTML告诉你的服务器 var cheerio = require('cheerio'), $ = cheerio.load('<h2 cla

性能优化之reflow和repaint

本文主要介绍一下什么是reflow,repaint, 怎样避免它们造成的不良影响, 怎么通过工具查看分析它们. 一.首先对浏览器渲染引擎下网页呈现过程简要说一下: 浏览器的渲染引擎开始解析html构建成DOM树,DOM树是以document对象为根节点,包含所有的html标签, 包括display: none隐藏的,也包括js动态添加的元素. 解析html的同时, 将css文件或者样式元素中的样式解析成CSS Rule Tree,解析时会去掉浏览器不能识别的样式. 根据DOM树和CSSOM来构造

Layer组件多个iframe弹出层打开与关闭及参数传递

一.Layer简介 Layer是一款近年来备受青睐的web弹层组件,基于jquery,易用.实用,兼容包括IE6在内的所有主流浏览器,拥有丰富强大的可自定义的功能. Layer官网地址:http://layer.layui.com/ 二.多个iframe弹出层(非嵌套) 1.打开iframe弹出层js代码 (1)示例一: layer.open({ type: 2, title: 'layer mobile页', shadeClose: true, shade: 0.8, area: ['380p

HTML DOM 层级

热门专题