`
wankunde
  • 浏览: 163001 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

[转载]YUI中文Dom操作(三)

阅读更多

YAHOO.util.Dom.getRegion( node )

返回指定元素的区域位置。该元素必须存在于 DOM 树中以拥有区域(display:none 或没有添加到DOM中的元素返回 false)。
Parameters:
el <String | HTMLElement | Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
Returns: Region | Array
一个或一组包含"top, left, bottom, right"成员数据的 Region 对象实例。

演示实例:http://www.css88.com/YUI/DOM/getRegion.html
转载请注明出处:http://www.css88.comhttp://www.9demo.com

============================================================

YAHOO.util.Dom.getStyle ( el , property )

String | Array getStyle ( el , property )
标准化 currentStyle 和 ComputedStyle.
Parameters:
el <String | HTMLElement |Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
property <String> 要获取的样式属性名
Returns: String | Array
该(组)元素的指定样式属性的当前值。

YAHOO.util.Dom.getRegion.setStyle ( el , property , val )
void setStyle ( el , property , val )
封装对 HTMLElement 的 style 属性的设置。标准化跨浏览器的 "opacity" 样式。
Parameters:
el <String | HTMLElement | Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
property <String> 要设置的 style 属性
val <String> 应用到该 style 属性的值
Returns: void

演示实例:http://www.css88.com/YUI/DOM/getStyle&setStyle.html
转载请注明出处:http://www.css88.comhttp://www.9demo.com

============================================================

YAHOO.util.Dom.getViewportWidth()和YAHOO.util.Dom.getViewportHeight()

返回窗口当前的可视宽度/高度。
Returns: Int
页面可视区域的宽度/高度 (不包括滚动条)。

注意:如果您改变窗口大小,这两个值会发生变换,注意“可视”

演示实例:http://www.css88.com/YUI/DOM/getViewportWidth&getViewportHeight.html
转载请注明出处:http://www.css88.comhttp://www.9demo.com

============================================================

YAHOO.util.Dom.getX( el )

Number | Array getX ( el )
基于页面坐标获取一个元素当前的 X 坐标位置。该元素必须存在于 DOM 树中以拥有页面坐标(display:none 或没有添加到DOM中的元素返回 false)。
Parameters:
el <String | HTMLElement | Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
Returns: Number | Array
该(组) 元素的 X 坐标位置

--------------------------------------------------------------------------------

YAHOO.util.Dom.getXY ( el )
基于页面坐标获取一个元素当前坐标位置。该元素必须存在于 DOM 树中以拥有页面坐标(display:none 或没有添加到DOM中的元素返回 false)。
Parameters:
el <String | HTMLElement | Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
Returns: Array
该(组) 元素的坐标位置

--------------------------------------------------------------------------------

YAHOO.util.Dom getY ( el )
基于页面坐标获取一个元素当前的 X 坐标位置。该元素必须存在于 DOM 树中以拥有页面坐标(display:none 或没有添加到DOM中的元素返回 false)。
Parameters:
el <String | HTMLElement | Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
Returns: Number | Array
该(组) 元素的 X 坐标位置


===========================================
YAHOO.util.Dom.setX ( el , x )
设置一个(组) html 元素在页面坐标中的 X 位置,不管该元素的 position 样式控制。该元素必须存在于 DOM 树中以拥有页面坐标(display:none 或没有添加到DOM中的元素返回 false)。
Parameters:
el <String | HTMLElement | Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
x <Int> 设置给该(组)元素的的 X 坐标
Returns: void

--------------------------------------------------------------------------------

YAHOO.util.Dom. setXY ( el , pos , noRetry )
设置一个(组) html 元素在页面坐标中的 X 位置,不管该元素的 position 样式控制。该元素必须存在于 DOM 树中以拥有页面坐标(display:none 或没有添加到DOM中的元素返回 false)。
Parameters:
el <String | HTMLElement | Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
pos <Array> 包含新的X & Y坐标(基于页面坐标)
noRetry <Boolean> 缺省情况下,如果第一次设置坐标失败,我们尝试第二次设置。
Returns: void

--------------------------------------------------------------------------------

YAHOO.util.Dom.setY ( el , x )
设置一个(组) html 元素在页面坐标中的 Y 位置,不管该元素的 position 样式控制。该元素必须存在于 DOM 树中以拥有页面坐标(display:none 或没有添加到DOM中的元素返回 false)。
Parameters:
el <String | HTMLElement | Array> 接受一个会将其当作ID来获取DOM引用的字符串,或者一个真实的DOM引用,或者一个包含ID及/或引用的数组。
x <Int> 设置给该(组)元素的的 X 坐标
Returns: void  

演示实例:http://www.css88.com/YUI/DOM/getXY&setXY.html
转载请注明出处:http://www.css88.comhttp://www.9demo.com

============================================================

YAHOO.util.Dom.removeClass( el , className )

移除给定的一个或一组元素的某个 class 。
Parameters:
el <String | HTMLElement | Array> 要移除其 class 的一个或一组元素
className <String> 要从 class 属性中移除的 class
Returns: Boolean | Array
移除成功返回 true,反之返回 false,或者一个包含这样的布尔值的数组

YAHOO.util.Dom.replaceClass( el , oldClassName , newClassName)

替换给定的一个或一组元素的某个 class 。如果旧 class 不存在,则简单的添加新的 class 。 If no oldClassName is present, the newClassName is simply added.
Parameters:
el <String | HTMLElement | Array> 要替换其 class 的一个或一组元素
oldClassName <String> 将被替换的旧 class
newClassName <String> 将替换旧 class 的 新 class
Returns: Boolean | Array
替换成功返回 true,反之返回 false,或者一个包含这样的布尔值的数组

YAHOO.util.Dom.hasClass( el , className )

判定一个 HTMLElement 是否拥有给定的 className.
Parameters:
el <String | HTMLElement | Array> 要检测的一个或一组元素
className <String> 要检索的 className
Returns: Boolean | Array
如果拥有返回 true,反之返回 false,或者一个包含这样的布尔值的数组

演示实例:http://www.css88.com/YUI/DOM/hasClass.html
转载请注明出处:http://www.css88.comhttp://www.9demo.com

============================================================================

YAHOO.util.Dom. inDocument ( el )
判定一个 HTMLElement 是否在当前文档中存在。
Parameters:
el <String | HTMLElement> 要搜索的元素
Returns: Boolean
如果存在于当前文档返回 true,反之 false

--------------------------------------------------------------------------------
YAHOO.util.Dom. isAncestor ( haystack , needle )
判定一个 HTMLElement 在DOM中是否是另一个 HTML 元素的祖先节点。
Parameters:
haystack <String | HTMLElement> 可能的祖先节点
needle <String | HTMLElement> 可能的后代节点
Returns: Boolean
如果前者是后者的祖先节点返回 true,反之 false

演示实例:http://www.css88.com/YUI/DOM/inDocument.html
转载请注明出处:http://www.css88.comhttp://www.9demo.com

==================================================================

YAHOO.util.Dom. insertAfter ( newNode , referenceNode )
将新节点插入到参考节点之后,成为其下一个兄弟节点。
Parameters:
newNode <String | HTMLElement> 要被插入的节点
referenceNode <String | HTMLElement> 在其后插入新节点的参考节点
Returns: HTMLElement
返回被插入的节点(或插入失败时返回 null)

--------------------------------------------------------------------------------

YAHOO.util.Dom. insertBefore ( newNode , referenceNode )
将新节点插入到参考节点之前,成为其上一个兄弟节点。
Parameters:
newNode <String | HTMLElement> 要被插入的节点
referenceNode <String | HTMLElement> 在其之前插入新节点的参考节点
Returns: HTMLElement
返回被插入的节点(或插入失败时返回 null)

分享到:
评论

相关推荐

    《YUI使用文档》汉语版的yui学习材料

    总的来说,YUI提供了一套完整的工具集,涵盖了从基本的DOM操作到复杂的UI构建和事件处理,是JavaScript开发者实现高效、可维护的前端应用的强大武器。这份汉语版的YUI使用文档对于中国开发者来说,无疑是一个宝贵的...

    Yahoo YUI2.7中文API 完整版

    **Yahoo YUI 2.7 中文 API 完整版** Yahoo User Interface Library(简称 YUI)是由 Yahoo 开发的一款开源 JavaScript 和 CSS 库,旨在帮助开发者构建高性能、可维护的 Web 应用程序。YUI 2.7 版本是这个库的一个...

    经典的YUI 示例中文文档

    ### 经典的YUI 示例中文文档 #### YUI概述 YUI(Yahoo User Interface Library)是由雅虎公司开发的一款免费、开源的JavaScript库。它包含了一系列强大的UI控件和实用工具,旨在帮助开发者轻松地构建高性能的Web...

    yui3-master.zip

    YUI3的Node模块是对DOM操作的进一步抽象,它提供了一种链式调用的方式,使DOM操作更为简洁。在“yui3-master.zip”的“node”模块中,可以找到`Y.Node`, `Y.all`等方法,它们使得DOM操作更加符合JavaScript的编程...

    yui.rar 例子

    在“yui.rar”里,可能包含有如“yui-core”、“yui-dom”、“yui-event”等基础模块,这些模块分别对应核心功能、DOM操作和事件处理。开发者可以通过精确定义配置,选择需要的模块,确保代码高效运行。 YUI还提供...

    YUI 详细说明文档

    YUI的DOM操作模块简化了对DOM树的操作,使得常见的DOM操作变得简单易行。 **2.1 Element的查找** - `YAHOO.util.Dom.get(element)`:通过ID获取DOM元素。 - `YAHOO.util.Dom.getElementsBy(method, tagName, ...

    yui_2.6.0r2

    YUI 2.6.0r2版本在当时的JavaScript社区中占有重要地位,它提供了大量的可重用模块,涵盖了DOM操作、事件处理、动画效果、Ajax交互、CSS样式管理、数据处理等多个领域。这个版本修复了之前的一些已知问题,增强了...

    yui 资源包

    1. **DOM操作**:YUI的Node和Selector模块提供了高效的DOM操作接口,包括选择、操作、遍历DOM元素。 2. **Ajax**:IO模块用于实现异步数据请求,支持JSONP、XHR等通信方式。 3. **表格与表单**:DataTable和Form模块...

    YUi文档(中文的哦)

    ### YUI3中文文档知识点详解 #### YUI3概述及YUIGlobal对象介绍 **YUI3** 是一个开源的JavaScript库,旨在提供一系列工具和API,帮助开发者构建高性能、高质量的Web应用。YUI3的核心优势在于其模块化的设计、强大...

    YUI中文文档CHM

    YAHOO YUI 中文文档 AJAX 详细 比较好用

    Jquery、YUI、ExtJs 三大javascript框架表单验证带提示功能的demo

    YUI是雅虎开发的一个开源前端开发库,它包括了丰富的组件和工具,如DOM操作、事件处理、动画效果等。在表单验证方面,YUI提供了`YUI.FormValidator`模块,可以创建自定义验证规则,支持实时验证和提交时验证。通过`...

    YUI3.6文档及示例

    4. **样式与动画**:YUI3.6包含了CSS类操作和动画效果的实现,可以轻松实现复杂的页面过渡和动画效果。 5. **数据管理**:提供了数据存储和模型层管理,方便在客户端进行数据操作和同步。 6. **用户界面组件**:...

    YUI.rar_html_javascript YUI_yui_yui javascript

    6. **DOM操作**:YUI提供了强大的DOM操作接口,包括选择元素、修改属性、插入和删除节点等。 7. **AJAX**:YUI的AJAX组件支持异步数据交换,使得网页可以在不刷新的情况下更新内容。 8. **动画效果**:YUI的Anim模块...

    yui_3.8.1.zip

    三、YUI 3.8.1的组件库 在YUI 3.8.1中,除了上述核心特性外,还包括众多实用的组件: 1. **DataTable**:用于创建交互式表格,支持排序、分页、筛选等功能。 2. **Charts**:基于SVG或VML的图表库,可以生成各种...

    YUI3.7.3 最新版本 带API

    4. **DOM操作**:YUI3提供了丰富的DOM操作接口,如查找元素(YUI.one, YUI.all)、创建和修改元素、以及动画效果等。 5. **IO模块**:YUI3的IO模块支持Ajax请求,包括GET、POST等多种HTTP方法,以及异步请求和JSONP...

    YAHOO yui2.7 文档+ 代码+例子

    YUI由多个核心模块组成,包括事件处理、DOM操作、动画效果、拖放功能、Ajax通信、数据存储、国际化支持等。这些组件是可选的,开发者可以根据项目需求按需加载,降低了页面加载的时间。 - **事件处理**:YUI提供了...

    YUI2.8.1包括demo api是学习的好东西

    2. **DOM操作**:YUI提供了强大的DOM操作API,如选择器引擎(YAHOO.util.Selector)用于高效地定位DOM元素,以及一系列方法用于创建、修改和删除DOM节点。 3. **事件处理**:YUI的事件系统允许开发者方便地绑定和...

    一些关于YUI的资源

    2. **DOM操作**:YUI提供了强大的DOM操作API,使得对HTML元素的选择、遍历、修改变得简单易行。这些工具大大简化了JavaScript与HTML之间的交互,提高了开发效率。 3. **事件处理**:YUI的事件系统支持事件委托、...

    针对YUI框架API

    每个功能或组件都被封装为独立的模块,如Event(事件)、Animation(动画)、Node(DOM操作)等。开发者可以根据项目需求选择需要的模块,降低代码体积,提高性能。 2. **事件系统** YUI的Event模块提供了全面的...

    yui_3.0.0(雅虎官方)

    7. **DOM操作和选择器**:YUI提供了强大的DOM操作接口,包括元素的选择、遍历、创建和修改等,同时也支持Sizzle CSS选择器引擎,使得元素选取更高效。 8. **国际化和本地化**:YUI 3.0.0支持多语言和本地化,提供了...

Global site tag (gtag.js) - Google Analytics