mootools温习与深入_Element

document.id

1var btn = document.id("btn")2 btn.addEvent(3 "click",4function(){5     alert("clicking on the btn")6     }7 )

同样也可以是：$.

var myElement = $('myElement');var myElement2 = document.id('myElement');

$$的用法.
用于返回一类元素或通过多个选择条件进行过滤和赛选。
$$('a'); // 返回页面中所有的a标签对象.
$$(element1, element2, element3); // 返回这三个对象.
$$('#myElement'); // 返回id为myElement的对象.
$$('#myElement a.myClass'); // 返回页面内id为myElement,含有myClass类的a标签对象.
$$('a, b'); // a代表<a></a>, b代表bold.即返回这两者对象.

Element
var myEl = new Element(element[, properties]);

// Creating an new anchor with an Objectvar myAnchor = new Element('a', {    href: 'http://mootools.net',    'class': 'myClass',    html: 'Click me!',    styles: {        display: 'block',        border: '1px solid black'    },    events: {        click: function(){            alert('clicked');        },        mouseover: function(){            alert('mouseovered');        }    }});

// Using Selectorsvar myNewElement = new Element('a.myClass');

getElement: var firstDiv = $(document.body).getElement('div'); 返回第一个对象
getElements: var myElements = myElement.getElements(tag); 返回所有符合对象
getElementById: var myElement = anElement.getElementById(id); 返回对应id的对象

Element.set(arguments):

$('myElement').set('text', 'text goes here');$('myElement').set('class', 'active');// the 'styles' property passes the object to Element:setStyles.var body = $(document.body).set('styles', {    font: '12px Arial',    color: 'blue'});

var myElement = $('myElement').set({// the 'styles' property passes the object to Element:setStyles.    styles: {        font: '12px Arial',        color: 'blue',        border: '1px solid #f00'    },// the 'events' property passes the object to Element:addEvents.    events: {        click: function(){ alert('click'); },        mouseover: function(){ this.addClass('over'); }    },//Any other property uses Element:setProperty.    id: 'documentBody'});

Element.get 返回对象属性值
var id = $('myDiv').get('id'); // returns "myDiv".
var value = $('myInput').get('value'); // returns the myInput element's value
Element.erase 擦出对象属性值
$('myDiv').erase('id'); //Removes the id from myDiv.
$('myDiv').erase('class'); //myDiv element no longer has any class names set.
Element.match 返回布尔值，反映是否匹配。
var el = $('myDiv');
$('myDiv').match(el); // returns true
$('otherElement').match(el); // returns false
Element.contains. 返回布尔值，反映是否包含。

转载于:https://www.cnblogs.com/santiago1983/archive/2011/12/14/2288210.html

mootools温习与深入_Element_1相关推荐

返回顶部的js实现(jQuery/MooTools)
一.引言在web页面中,如果页面较高,为了方便用户快速地返回顶部,都会添加一个返回顶部按钮.例如: 如果你看到这段文字,说明转自<一棵树-博客园>,原文链接:http://www.cnb ...
使用Mootools动态添加Css样式表代码,兼容各浏览器
这个函数很有用处,尤其是当我们在使用Mootools开发插件的时候,例如Tips等,当我们需要额外的Css来支撑插件内的效果时,通常我们的做法是把Css放到单独的css文件里调用,但是这样做就不利于插 ...
[导入]几种流行的AJAX框架jQuery,Mootools,Dojo,Ext JS的对比
AJAX是web20的基石,现在网上流行几种开源的AJAX框架,比如:jQuery,Mootools,Dojo,Ext JS等等,那么我们到底在什么情况下该使用那个框架?以下是一组摘抄的数据: Aja ...
MooTools教程(1):认识MooTools
2019独角兽企业重金招聘Python工程师标准>>> 有人最近要求我们写一个关于MooTools 1.2的30天的教程,这似乎也是个很不错的主意,于是我们决定现在就开始.在这些教程 ...
cdn大全 jquery/jqueryUI/Dojo/MooTools/Prototype
类库预览 https://developers.google.com/speed/libraries/ Audience This documentation is designed for peop ...
DOS命令温习（图解）
因为近期在解决java web开发和arcgis开发中的相关疑难问题时,都使用了命令行:所以决定再温习强化dos命令,以加强基础: 1 从命令行创建文件下图第二条命令创建文件,type显示文件内容: ...
BC：带你温习并解读《腾讯区块链方案白皮书》—区块链的兴起和未来之路
BC:带你温习并解读<腾讯区块链方案白皮书>-区块链的兴起和未来之路目录腾讯区块链方案白皮书-前言区块链的兴起和未来之路腾讯区块链方案白皮书-前言区块链技术给数字经济时代带来了巨 ...
BC：带你温习并解读《中国区块链技术和应用发展白皮书》—区块链标准体系框架
BC:带你温习并解读<中国区块链技术和应用发展白皮书>-区块链标准体系框架目录区块链标准体系框架区块链标准化重点方向区块链标准化实施方案区块链标准体系框架 1.基础标准 2.业务 ...
BC：带你温习并解读《中国区块链技术和应用发展白皮书》—区块链技术发展路线图
BC:带你温习并解读<中国区块链技术和应用发展白皮书>-区块链技术发展路线图目录区块链通用技术需求区块链技术架构区块链核心关键技术区块链通用技术需求区块链应用的技术需求,除分布 ...

mootools温习与深入_Element_1

mootools温习与深入_Element_1相关推荐

最新文章

热门文章