dom对象 | 易学教程

angularJS directive用法详解

阅读更多关于 angularJS directive用法详解

前言最近学习了下angularjs指令的相关知识，也参考了前人的一些文章，在此总结下。欢迎批评指出错误的地方。 Angularjs指令定义的API AngularJs的指令定义大致如下 angular.module("app",[]).directive("directiveName",function(){ return{ //通过设置项来定义 }; })其中return返回的对象包含很多参数，下面一一说明你知道用AngularJs怎么定义指令吗？0 1.restrict （字符串）可选参数，指明指令在DOM里面以什么形式被声明；取值有：E(元素),A(属性),C(类),M(注释)，其中默认值为A； E(元素)：<directiveName></directiveName> A(属性)：<div directiveName='expression'></div> C(类)： <div class='directiveName'></div> M(注释)：<--directive:directiveName expression--> 你知道用AngularJs怎么定义指令吗？1 例如restrict：‘EA’ 则表示指令在DOM里面可用元素形式和属性形式被声明；一般来说，当你创建一个有自己模板的组件的时候，需要使用元素名，如果仅仅是为为已有元素添加功能的话，就使用属性名

BOM，DOM

阅读更多关于 BOM，DOM

一 BOM JavaScript分为 ECMAScript，DOM，BOM BOM（Browser Object Model）是指浏览器对象模型，它使 JavaScript 有能力与浏览器进行“对话”。 DOM （Document Object Model）是指文档对象模型，通过它，可以访问HTML文档的所有元素。 1. window对象　　Window对象是客户端JavaScript最高层对象之一，由于window对象是其它大部分对象的共同祖先，在调用window对象的方法和属性时，可以省略window对象的引用。例如：window.document.write()可以简写成：document.write()。　　所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。全局变量是 window 对象的属性。全局函数是 window 对象的方法。一些常用的Window方法： window.innerHeight - 浏览器窗口的内部高度 window.innerWidth - 浏览器窗口的内部宽度 window.open() - 打开新窗口 window.close() - 关闭当前窗口 2. location对象 window.location 对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面。常用属性和方法：

HTML DOM Document 对象

阅读更多关于 HTML DOM Document 对象

Document 对象每个载入浏览器的 HTML 文档都会成为 Document 对象。 Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。 Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。 HTMLDocument 接口对 DOM Document 接口进行了扩展，定义 HTML 专用的属性和方法。很多属性和方法都是 HTMLCollection 对象（实际上是可以用数组或名称索引的只读数组），其中保存了对锚、表单、链接以及其他可脚本元素的引用。这些集合属性都源自于 0 级 DOM。它们已经被 Document.getElementsByTagName() 所取代，但是仍然常常使用，因为他们很方便。 write() 方法值得注意，在文档载入和解析的时候，它允许一个脚本向文档中插入动态生成的内容。在 1 级 DOM 中，HTMLDocument 定义了一个名为 getElementById() 的非常有用的方法。在 2 级 DOM 中，该方法已经被转移到了 Document 接口，它现在由 HTMLDocument 继承而不是由它定义了。来源： https://www.cnblogs.com/ly52990/p/9984065.html

js原生选项卡 Dom部分

阅读更多关于 js原生选项卡 Dom部分

什么是dom ：　　1. DOM ======> Document Object Model 　　2. Dom定义了表示和修改文档所需要的方法。　　Dom对象即为宿主对象，有浏览器厂商定义，　　用来操作html和xml功能的一类对象集合。　　也有人称DOM是对html以及xml的标准编程接口。原生js选项: < ! DOCTYPE html > < html lang = "en" > < head > < meta charset = "UTF-8" > < meta name = "viewport" content = "width=device-width, initial-scale=1.0" > < title > Document < / title > < ! -- css部分 -- > < style > * { margin : 0 ; padding : 0 ; } . wrap { padding - top : 20 px ; box - sizing : border - box ; margin : 0 auto ; width : 50 pz ; height : 40 vw ; background : #f00 ; } . wrap div { width : 100 % ; height : 90 % ; margin - top :

JavaScript操作DOM对象

阅读更多关于 JavaScript操作DOM对象

1、访问节点 <!DOCTYPE html> < html> < head lang= "en "> < meta charset= "UTF-8 "> < title>访问节点</ title>  </ head> < body> < ul> < li>大家辛苦了1</ li> < li>大家辛苦了2</ li> < li>大家辛苦了3</ li> </ ul> < img src= "../images/cat.jpg " alt= "这是一只可爱的小猫咪 " id= "cat "> < script type= "text/javascript "> //获取ul中的第一个li var ul = document. getElementsByTagName( "ul ")[ 0]; //输出节点的名称 document. write( "ul节点的名称: " + ul. nodeName + "<br/> "); document. write( "ul节点的类型: " + ul. nodeType + "<br/> "

JavaScript组成部分

阅读更多关于 JavaScript组成部分

JavaScript由三部分组成：　　　　ECMAscript（JavaScript的核心标准，也是一个解析器）；　　　　　　　　目前常用的是两种：　　　　　　　　ES5，即2009年12月发布的JavaScript的核心标准；　　　　　　　　ES6，即2015年6月17日发布发布的JavaScript的核心标准；　　　　DOM（document object model 缩写，文档对象模型）；　　　　　　　　简单来说：就是通过document提供的一些接口（api），赋予开发者操作页面的能力。　　　　　　　　比如获取某个ID为div的元素，document.getElementById('div')这个就是一个简单的DOM操作。　　　　BOM（browser object model 缩写，浏览器对象模型）；　　　　　　　　由于BOM没有相关标准，每个浏览器都有其自己对BOM的实现方式，不同的浏览器DOM标准可能不一样。来源： https://www.cnblogs.com/yc-web/p/6881737.html

JavaScript核心 DOM

阅读更多关于 JavaScript核心 DOM

DOOM是什么? 文档对象模型(Document Obiect Moder)，是W3C组织推动的处理可扩展标记语言(HTML或者XML)的标准编程接口。通过DOM接口可以修改网页的内容、结构和样式。 DOM树文档：一个页面就是一个文档，DOM中使用doucment表示元素：页面中的所有标签都是元素，DOM中使用element表示节点：网页中的所有内容都是节点（标签、属性、文本、注释等）,DOM中使用node表示 DOM把以上内容都看做是对象！！！ dom操作主要是针对元素的操作,主要有创建、增、删、改、查、属性操作、事件操作创建 document.write innerHTML createElement 增 appendChild 前面 insertBefore 后面删 removeChild 改主要修改dom的元素属性,dom元素的内容,属性,表单的值等修改元素属性：src、href、title等修改普通元素内容：innerHTML、innerText 修改表单元素：value、type、disable等修改元素样式：style、className 查主要获取查询dom元素 DOM提供的API方法：getElementById、getElementsByTagName 古老用法不推荐,了解 H5提供的新方法：querySelector

jquery获取iframe中的dom对象

阅读更多关于 jquery获取iframe中的dom对象

父窗口中操作iframe：$(window.frames["iframeChild"].document) //假如iframe的id为iframeChild 在子窗口中操作父窗口：$(window.parent.document) 接下来就可以继续获取iframe内的dom了。获取iframe内的dom对象有两种方法 1 $(window.frames["iframeChild"].document).find("#child") 2 $("#child",window.frames["iframeChild"].document) 1.在父窗口中操作选中IFRAME中的所有单选按钮 $(window.frames["iframeChild"].document).find("input[@type='radio']").attr("checked","true"); 2.在IFRAME中操作选中父窗口中的所有单选按钮 $(window.parent.document).find("input[@type='radio']").attr("checked","true"); 来源： https://www.cnblogs.com/Qzhou/p/3166236.html

DOM

阅读更多关于 DOM

DOM 是 Document Object Model（文档对象模型）的缩写。（BOM 浏览器对象模型）；任意的文档都可以绘制成树状结构（一）节点层次 1.Node类型 IE中的所有DOM对象都是以COM对象的形式。 IE未公开Node类型的构造函数，直接用数字判断 node . nodeType == 1（ELEMENT_NODE）（1）nodeName : 标签名 nodeValue : 始终为null （2）节点关系 childNodes属性保存NodeList对象虽然可以通过方括号语法来访问NodeList的值，而且这个对象也有length属性，但它并不是Array实例。索引和.item()访问。转数组： function convertToArray(nodes) { var array = null; Try { array = Array . prototype . slice . call(someNode . childNodes , 0); } cache (ex) { array = new Array(); //<=IE8 for(var i = 0, len = nodes . length; i < len; i++) { array . push(nodes[i]); } } return array; } 1 2 3 4 5 6 7 8 9

页面重绘与重排版的性能影响

阅读更多关于页面重绘与重排版的性能影响

DOM树和渲染树　　当浏览器下载完所有页面HTML 标记，JavaScript，CSS，图片之后，它解析文件并创建两个内部数据结构：一棵DOM树表示页面结构，一棵渲染树表示DOM节点如何显示。渲染树中为每个需要显示的DOM 树节点存放至少一个节点（隐藏DOM 元素在渲染树中没有对应节点）。渲染树上的节点称为“框”或者“盒”，符合CSS 模型的定义，将页面元素看作一个具有填充、边距、边框和位置的盒。一旦DOM 树和渲染树构造完毕，浏览器就可以显示（绘制）页面上的元素了。重排版当DOM 改变影响到元素的几何属性（宽和高）——例如改变了边框宽度或在段落中添加文字，将发生一系列后续动作——浏览器需要重新计算元素的几何属性，而且其他元素的几何属性和位置也会因此改变受到影响。浏览器使渲染树上受到影响的部分失效，然后重构渲染树。这个过程被称作重排版。重排版完成时，浏览器在一个重绘进程中重新绘制屏幕上受影响的部分。不是所有的DOM 改变都会影响几何属性。例如，改变一个元素的背景颜色不会影响它的宽度或高度。在这种情况下，只需要重绘（不需要重排版），因为元素的布局没有改变。重绘和重排版是负担很重的操作，可能导致网页应用的用户界面失去相应。所以，十分有必要尽可能减少这类事情的发生。发生重排版情况正如前面所提到的，当布局和几何改变时需要重排版。在下述情况中会发生重排版： (1

订阅 dom对象