R.js

页面元素对象，通常用 ID、name、class 等属性匹配。

selector 选择器表达式或 Element 对象

context 基准对象，默认为 document

R("#example");

支持以下 CSS 选择器：

注意：此处元素对象为 Mo 对象，并不能像 DOM 对象一样直接操作和访问，如有需要，请使用 .item() 和 .each() 来转换成 DOM 对象。

检测在当前元素中是否包含某节点。

node 节点对象

R( document.body ).exist( R.$('wrapper') );

返回元素数量，如果没有则返回 0

R("#example").size();

返回指定位置元素 DOM，如果没有则返回 null

index 元素索引，从 0 开始计数，可以使用负数来倒序获取

self [可选]是否将当前元素置为所选元素，默认为 false

R("#example").item( 0 );

使用负数（-），从尾至首（倒序）返回指定位置元素

R("*").item( -4 );

将元素隐藏，并且可以设置回调事件

func 回调函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

R("#example").hide();

将元素显示，并且可以设置回调事件

func 回调函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

R("#example").show();

显示或隐藏元素。

func 回调函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

res 当前元素对象是否可见，true 或 false

R("#example").toggle();

R("#example").toggle( function( ele, res ){ alert( res ? '显示' : '隐藏' ) } );

返回元素的值，仅针对表单元素：input | radio | checkbox | button | file | select | textarea

R("#example").value();

测试

R("input[name=multi]").value();

测试

R("input[name=chkbox]").value();

A B C 测试

设置元素的值，仅针对表单元素：input | button | select | textarea

text 字符串（checkbox 和 radio 支持数组）

add [可选]是否在原字符串上追加

R("#example").value( 'Hello!');

返回选中元素的文本，仅针对表单元素：select

R("#example").text();

A+ B+ C+

设置选中元素的文本，仅针对表单元素：select

text 字符串

replace [可选]新的文本

R("#example").text( 'C+' );

A+ B+ C+

R("#example").text( 'C+', 'D+' );

测试

返回元素的 HTML 代码片段。

R("#example").html( );

设置或返回元素的 HTML 代码片段。

html HTML 代码片段

add [可选]是否在原代码上追加

R("#example").html( '<a href="http://www.veryide.com/">VeryIDE</a>' );

R("#example").html( '<a href="http://www.veryide.com/">VeryIDE</a>', true );

返回元素的属性信息，不存在则返回 null

attr 属性名称

value 属性值（可选）

R("#example").attr( "width" );

R("#example").attr( "width" , 100 );

R("#example").attr( { "height" : 100 } );

返回元素的 CSS 样式信息。

attr 属性名称

value 属性值（可选）

R("#example").style( "color" );

R("#example").style( "color" : "red" );

R("#example").style( { "fontColor" : "blue" } );

设置值时请使用如下语法：

返回第一个元素的位置和尺寸信息。

R("#example").position();

返回数据示例

{ width : 1292, height : 80, top : 9041, left : 86 }

遍历元素，对每个元素执行回调函数。

func 函数名称或匿名函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

index 当前元素索引值

R("#example").each( function( ele, index ){} );

注意：如果需要在执行过程中终止遍历，需要使用 return false;

R("#example").each( function( ele, index ){

        if( index == 2 ){
            return false;
        }

} );

使用自定义方法过滤元素。

func 函数名称或匿名函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

index 当前元素索引值

R("a").filter( function(){ return this.href.match(/\.(jpg|png|gif)/i); } );

访问上一个兄弟节点，并将其设置为当前节点。

self [可选]是否将当前元素置为所选元素，默认为 false

R("#example").prev( true );

访问下一个兄弟节点，并将其设置为当前节点。

self [可选]是否将当前元素置为所选元素，默认为 false

R("#example").prev( true );

访问元素父节点，并将其设置为当前节点。

level 节点层次，默认为 1

R("#example").parent( 2 );

将当前元素失去焦点，并回调函数。

func 回调函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

index 当前元素索引值

R("#example").blur();

为当前元素绑定指定的事件。

event 事件名称

func 函数名称或匿名函数

func 可接受参数

this 当前元素对象

this.index 当前元素索引值

event event 对象

R("#example").bind( 'click', function(){ alert("你点了我一下！"); } )

取消当前元素指定事件的绑定。

event 事件名称

R("#example").unbind( 'click' );

模拟事件响应。

R("#example").event('click');

将当前表单提交，并在之行执行函数。

func 回调函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

index 当前元素索引值

R("#example").submit();

func 需返回参数

true 继续表单提交

false 取消表单提交

R("#example").submit( function(){ return confirm( '确定要提交吗?' ); } );

将当前表单重置，并在之行执行函数。

func 回调函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

index 当前元素索引值

func 需返回参数

true 继续表单重置

false 取消表单重置

R("#example").reset( function(){ return confirm( '确定要重置吗?' ); } );

将当前元素设置焦点，并回调函数。

func 回调函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

index 当前元素索引值

R("#example").focus( function(){ R( this ).html( '光标在这里！' ); } );

测试

将当前元素失去焦点，并回调函数。

func 回调函数

func 可接受参数

ele 当前元素对象，也可直接使用 this

index 当前元素索引值

R("#example").blur();

将当前元素禁用。

R("#example").disabled();

注意：在 Webkit 为核心的浏览器中，.disabled() 容器并不会影响子元素，如有必要请使用 R("#example *").disabled(); 来实现 。

将当前元素启用。

R("#example").enabled();

注意：在 Webkit 为核心的浏览器中，.enabled() 容器并不会影响子元素，如有必要请使用 R("#example *").enabled(); 来实现 。

选中或取消选中当前元素，本方法只针对 checkbox 元素有效。

boolean 布尔值，true 或 false，为空时为反选

R("input[type=checkbox]").checked( true );

全选

R("input[type=checkbox]").checked( false );

不选

R("input[type=checkbox]").checked();

反选

A B C C D E

将当前元素插入到指定位置。

node 元素集合，hr, br 形式，可以多个

attr 属性集合，{ "abc" : "def" } 形式，可以多个

R("#example").append( "p" );

同时插入有属性元素。

R("#example").append( "p" , { "innerHTML" : "我是刚创建的 p 标签。" } );

在当前元素前面位置创建兄弟元素。

node 标签名称

attr 属性集合，{ "abc" : "def" } 形式，可以多个

R("#example").before( "p" , { "innerHTML" : "我是刚创建的 p 标签。" } );

在当前元素后面位置创建兄弟元素。

node 标签名称

attr 属性集合，{ "abc" : "def" } 形式，可以多个

R("#example").after( "p" , { "innerHTML" : "我是刚创建的 p 标签。" } );

将当前元素插入到指定位置。

node 元素集合，hr, br 形式，可以多个

attr 属性集合，{ "abc" : "def" } 形式，可以多个

R("#example").replace( document.createElement("hr") );

同时插入有属性元素。

R("#example").replace( "p" , { "innerHTML" : "我是刚创建的 p 标签。" } );

将当前元素插入到指定位置。

node 元素集合，hr, br 形式，可以多个

attr 属性集合，{ "abc" : "def" } 形式，可以多个

R("#example").replace( document.createElement("hr") );

同时插入有属性元素。

R("#example").replace( "p" , { "innerHTML" : "我是刚创建的 p 标签。" } );

将当前元素从页面中移除。

R("#example").remove();

将当前属性从元素中移除。

R("#example").remove( 'style' );

在当前元素指定位置插入内容。

position 位置（可选参数：beforebegin、afterbegin、beforeend、afterend）

object HTML 或元素

<!-- beforebegin -->
<p>
<!-- afterbegin -->
foo
<!-- beforeend -->
</p>
<!-- afterend -->

R("#example").adjacent( "beforebegin" , '<p>我是刚创建的 p 标签。</p>' );

R("#example").adjacent( "beforebegin" , document.createElement('hr') );