Element

优质

小牛编辑

116浏览

2023-12-01

Type: Window

下面的函数将被视为Window方法。

Function: document.id

该函数有两个目的,一个通过ID取得元素.取得所有Element对像的方法(扩展一元素为mootools元素).

语法:

var myElement = document.id(el);

参数:

el - 可以是以下类型:
- (element) 元素将被扩展,如果还没有扩展。
- (string) 元素ID。
- (object)如果对象有一个toElement方法，toElement将被调用来获取元素。

(element)一个DOM元素。
(null)Null，如果没有找到元素，或toElement没有返回元素。

示例:

通过ID取得元素:

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

通过元素引用:

var div = document.getElementById('myElement');
div = document.id(div); // the element with all the Element methods applied.

Function: $

$函数是document.id函数的别名,如果$被其它javascript库使用,Mootools将不重写$.(不建议使用多个冲突的js库)

示例:

var myElement = $('myElement');
var myElement2 = document.id('myElement');
 
myElement == myElement2; // returns true
 
 
(function($){
 
    // Now you can use $ safely in this closure
 
})(document.id)

Function: $$

选择和扩展DOM元素。返回一组元素实例。返回的这组元素实例是一个类似数组的对象，支持每个数组的方法，每一个元素的方法。

语法:

var myElements = $$(argument);

参数:

selector - (string)一个CSS选择器
elements - (elements)(collection)或(array)元素的一个枚举列表
element, element - (element)任意数量的元素作为参数

(elements) - 一个类数组的元素集合,已经被document.id扩展为mootools Elemment对象.

示例:

通过标签名:

$$('a'); // returns all anchor elements in the page.

通过多个元素实例:

$$(element1, element2, element3); // returns an Elements instance containing these 3 elements.

通过一个元素集合:

$$([element1, element2, element3]); // returns an Elements instance containing these 3 elements.
$$(document.getElementsByTagName('a')); // returns an Elements instance containing the result of the getElementsByTagName call.

通过CSS选则器:

$$('#myElement'); // returns an Elements instance containing only the element with the id 'myElement'.
$$('#myElement a.myClass'); // returns an Elements instance of all anchor tags with the class 'myClass' within the DOM element with id 'myElement'.
$$('a, b'); // returns an array of all anchor and bold elements in the page.

Type: Element

自定义类型。

Element Method: constructor

创建新元素.

语法:

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

参数:

element - (mixed)为要创建的元素或一个实际的DOM元素或CSS选择器的标签名称。
properties - (object, optional)设置元素属性。

(element)一个新的MooTools扩展后的HTML元素。

示例:

// Creating an new anchor with an Object
var 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 Selectors
var myNewElement = new Element('a.myClass');

注意:

因为元素名称解析为一个CSS选择器，所以冒号必须转义。因此，new Element('fb\:name)成为<fb:name>。

Element Method: getElement

取得第一个子元素。

语法:

var myElement = myElement.getElement(tag);

参数:

tag - (string)一个CSS选择器的名称。

(mixed)如果找到一个匹配，元素将被返回。否则，返回null。

示例:

var firstDiv = $(document.body).getElement('div');

注意事项:

Element Method: getElements

根据CSS选择器取得元素数组.

语法:

var myElements = myElement.getElements(tag);

参数:

tag - (string) 一个CSS选择器。

(array)元素数组(所有匹配的元素)。

示例:

var allAnchors = $(document.body).getElements('a');

注意事项:

这种方法也可用于Document对象。
默认支持的CSS选择器与W3C CSS3 selectors一样。

Element Method: getElementById

通过ID取得元素。

语法:

var myElement = anElement.getElementById(id);

参数:

id - (string)要获取的元素的ID。

(mixed)如果找到此元素，返回该元素。否则，返回null。

示例:

var myChild = $('myParent').getElementById('myChild');

注意事项:

此方法不支持没有原生document.getElementById函数的浏览器。

Element Method: set

设置元素属性.

语法:

myElement.set(arguments);

参数:

两个参数(属性,值)
- property - (string)属性名.
- value - (mixed)属性值.
一个参数(多个属性)
- properties - (object)一个对象包含多个属性(属性名/属性值).

(element)当前元素。

示例:

两个参数:

$('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 Method: get

取得元素属性。

语法:

myElement.get(property);

参数:

property - (string)属性名。

(mixed)属性值(调用Element.Properties对象中'get'函数得到的结果)。

示例:

用自定义Getters:

var tag = $('myDiv').get('tag'); // returns "div".

取得原生元素属性:

var id = $('myDiv').get('id'); // returns "myDiv".
var value = $('myInput').get('value'); // returns the myInput element's value.

Element Method: erase

移除一个元素的属性。

语法:

myElement.erase(property);

参数:

property - (string)调用Element.Properties对象的'erase'方法移除一个属性。

调用Element.Properties对象的'erase'函数,返回值为erase函数的返回值.

示例:

$('myDiv').erase('id'); //Removes the id from myDiv.
$('myDiv').erase('class'); //myDiv element no longer has any class names set.

注意:

如果相应的Element.Properties对象不存在'erase'方法，元素的'removeProperty'函数将被调用.

Element Method: match

测试此元素，看它是否与传入的参数匹配

语法:

myElement.match(match);

参数:

match - 可以是一个字符串或元素
- (string)标签名称，或单一的CSS选择器。
- (element)一个元素，如果两元素相同,则返回true

(boolean)如果元素匹配，返回true 。否则，返回false 。

示例:

用一个标签:

// returns true if #myDiv is a div.
$('myDiv').match('div');

用CSS选择器:

// returns true if #myDiv has the class foo and is named "bar"
$('myDiv').match('.foo[name=bar]');

用一个元素:

var el = $('myDiv');
$('myDiv').match(el); // returns true
$('otherElement').match(el); // returns false

Element Method: contains

检查是否包含某元素。

语法:

var result = myElement.contains(el);

参数:

el - (element)要搜索的元素。

(Boolean)返回true，如果包含某元素.否则为false。

示例:

HTML

<div id="Darth_Vader">
    <div id="Luke"></div>
</div>

JavaScript

if ($('Darth_Vader').contains($('Luke'))) alert('Luke, I am your father.'); //tan tan tannn...

Element Method: inject

在某个元素中注入或插入另一个元素.

语法:

myElement.inject(el[, where]);

参数:

el - (mixed) 可以是元素对象或元素的id 。
where - (string, optional: defaults to 'bottom') 注入元素的位置。可以'top'，'bottom'，'after','before'。

(element)当前元素。

示例:

Javascript

var myFirstElement  = new Element('div', {id: 'myFirstElement'});
var mySecondElement = new Element('div', {id: 'mySecondElement'});
var myThirdElement  = new Element('div', {id: 'myThirdElement'});

生成的HTML

<div id="myFirstElement"></div>
	<div id="mySecondElement"></div>
	<div id="myThirdElement"></div>

注入到底部:

Javascript

myFirstElement.inject(mySecondElement);

生成的HTML

<div id="mySecondElement">
    <div id="myFirstElement"></div>
</div>

注入到顶端:

Javascript

myThirdElement.inject(mySecondElement, 'top');

生成的HTML

<div id="mySecondElement">
    <div id="myThirdElement"></div>
    <div id="myFirstElement"></div>
</div>

注入前端:

Javascript

myFirstElement.inject(mySecondElement, 'before');

生成的HTML

<div id="myFirstElement"></div>
	<div id="mySecondElement"></div>

注入后端:

Javascript

myFirstElement.inject(mySecondElement, 'after');

生成的HTML

<div id="mySecondElement"></div>
	<div id="myFirstElement"></div>

Element Method: grab

与Element:inject工作原理相似,但是反向的.

附加元素在相对于元素的子元素的特定位置(由所在参数指定) 。

语法:

myElement.grab(el[, where]);

参数:

el - (mixed) 可以是一个元素或元素的id。
where - (string, optional: default 'bottom')来追加该元素的地方。可以是"top"，"bottom"，"before"或"after"。

(element)当前元素。

示例:

HTML

<div id="first">
    	<div id="child"></div>
	</div>

Javascript

var mySecondElement = new Element('div#second');
$('first').grab(mySecondElement);

生成的HTML

<div id="first">
    <div id="child"></div>
    <div id="second"></div>
</div>

Javascript

var mySecondElement = new Element('div#second');
myFirstElement.grab(mySecondElement, 'top');

生成的HTML

<div id="first">
    <div id="second"></div>
    <div id="child"></div>
</div>

Element Method: adopt

如Element:grab,但可以允许多个元素追加到底部.

在一个元素内部插入一新元素。

语法:

myParent.adopt(el[, others]);

参数:

el - (mixed) 一个元素或一个元素的数组或一个元素的ID。
others - (mixed, optional) 一个或更多逗号分隔的元素,或一个数组。

(element)当前元素。

示例:

Javascript

var myFirstElement  = new Element('div#first');
var mySecondElement = new Element('p#second');
var myThirdElement  = new Element('ul#third');
var myFourthElement = new Element('a#fourth');
 
var myParentElement = new Element('div#parent');
 
myFirstElement.adopt(mySecondElement);
mySecondElement.adopt(myThirdElement, myFourthElement);
myParentElement.adopt([myFirstElement, new Element('span#another')]);

生成的HTML

<div id="parent">
    <div id="first">
        <p id="second">
            <ul id="third"></ul>
            <a id="fourth"></a>
        </p>
    </div>
    <span id="another"></span>
</div>

Element Method: wraps

与Element:grab相似,但此方法加包裹指定元素,并替换指定元素原来的位置.

语法:

myParent.wraps(el[, where]);

参数:

el - (mixed)元素或元素的ID 。
where - where - (string, optional: default 'bottom')要插入的位置。可以是"top"或"bottom" 。

(element)当前元素。

示例:

HTML

<div id="first"></div>

Javascript

var mySecondElement = new Element('div#second').wraps('first');

生成的HTML

<div id="second">
    <div id="first"></div>
</div>

HTML

<div id="first"></div>
<div id="second">
    <div id="child"></div>
</div>

Javascript

$('second').wraps('first');

生成的HTML

<div id="second">
    <div id="child"></div>
    <div id="first"></div>
</div>

Javascript

$('second').wraps('first', 'top');

生成的HTML

<div id="second">
    <div id="first"></div>
    <div id="child"></div>
</div>

Element Method: appendText

向元素内部追回文本.

语法:

myElement.appendText(text[, where]);

参数:

text - (string)要追加的文本。
where - (string, optional: default 'bottom') 文本的注入位置。可以是'top','bottom','before','after' 。

(element)当前元素的实例。

示例:

HTML

<div id="myElement">Hey.</div>

Javascript

$('myElement').appendText(' Howdy.');

生成的HTML

<div id="myElement">Hey. Howdy.</div>

Element Method: dispose

从DOM中移除元素。

语法:

var removedElement = myElement.dispose();

(element)被删除的元素。

示例:

HTML

<div id="myElement"></div>
<div id="mySecondElement"></div>

JavaScript

$('myElement').dispose();

生成的HTML

<div id="mySecondElement"></div>

Element Method: clone

克隆一个元素，并返回克隆体。

语法:

var copy = myElement.clone([contents, keepid]);

参数:

contents - (boolean,optional:defaults true )当设置为false的元素的内容不被克隆。
keepid - (boolean, optional: defaults to false) 如果为true克隆的元素保留id.同样适用于任何克隆的子节点。

(element)克隆的元素。

示例:

HTML

<div id="myElement">ciao</div>

JavaScript

// clones the Element and appends the clone after the Element.
var clone = $('myElement').clone().inject('myElement','after');

生成的HTML

<div id="myElement">ciao</div>
<div>ciao</div>

Element Method: replaces

替换元素。

语法:

var element = myElement.replaces(el);

参数:

el - (mixed)一个元素ID或一个元素对象。

(element)当前元素。

示例:

$('myNewElement').replaces($('myOldElement'));
//$('myOldElement') is gone, and $('myNewElement') is in its place.

Element Method: hasClass

测试元素是否有某class.

语法:

var result = myElement.hasClass(className);

参数:

className - (string)class的名字。

(boolean)返回true如果元素具有此类，否则为false。

示例:

HTML

<div id="myElement"></div>

JavaScript

$('myElement').hasClass('testClass'); // returns true

Element Method: addClass

为元素增加一个类.

语法:

myElement.addClass(className);

参数:

className - (string) 要添加的类名。

(element)当前元素。

示例:

HTML

<div id="myElement"></div>

JavaScript

$('myElement').addClass('newClass');

生成的HTML

<div id="myElement"></div>

Element Method: removeClass

删除元素的一个类.

语法:

myElement.removeClass(className);

参数:

className - (string)要删除的类名。

(element)当前元素。

示例:

HTML

<div id="myElement"></div>

JavaScript

$('myElement').removeClass('newClass');

生成的HTML

<div id="myElement"></div>

Element Method: toggleClass

切换类,如果已存在则删除,如果不存在则添加。

语法:

myElement.toggleClass(className, force);

参数:

className - (string)要添加或删除的类。
force - (boolean, optional)是否强制执行.

(element)当前元素。

示例:

HTML

<div id="myElement"></div>

JavaScript

$('myElement').toggleClass('myClass');

生成的HTML

<div id="myElement"></div>

JavaScript

$('myElement').toggleClass('myClass');

生成的HTML

<div id="myElement"></div>

Element Method: getPrevious

返回前一个兄弟元素节点,不包含纯文本节点.

语法:

var previousSibling = myElement.getPrevious([match]);

参数:

match - (string, optional)一个CSS选择器。

(mixed)返回前一个兄弟元素,如果没有发现返回null

Element Method: getAllPrevious

与Element:getPrevious类似,但返回元素之前所有匹配的元素.

Element Method: getNext

返回后一个兄弟元素节点,不包含纯文本节点.。

语法:

var nextSibling = myElement.getNext([match]);

参数:

match - (string, optional)一个CSS选择器。

(mixed)返回下一个兄弟元素,如果没有发现返回null

Element Method: getAllNext

与Element.getNext类似,但返回元素之后所有匹配的元素.

Element Method: getFirst

得到第一个匹配的元素。

语法:

var firstElement = myElement.getFirst([match]);

参数:

match - (string, optional) 一个CSS选择器。

(mixed)返回匹配的第一个元素,如果没有找到返回null。

Element Method: getLast

得到第一个匹配的元素.

语法:

var lastElement = myElement.getLast([match]);

参数:

match - (string, optional) 一个CSS选择器。

(mixed)返回匹配到的最后一个元素，如果没有找到则返回null。

Element Method: getParent

返回父节点.

语法:

var parent = myElement.getParent([match]);

参数:

match - (string, optional)一个CSS选择器。

(mixed)返回父节点，如果没有发现返回null。

Element Method: getParents

从当前元素延节点树向上匹配,返回所有匹配到的节点集合.

(array)返回父类数组，如果没有父类返回一个空数组。

Element Method: getSiblings

返回元素的兄弟节点,不包含纯文本节点。

语法:

var siblings = myElement.getSiblings([match]);

参数:

match - (string, optional)一个CSS选择器。

(array) 兄弟元素数组，不包含纯文本节点。

Element Method: getChildren

返回所有元素的子元素(不包括文本节点)。

语法:

var children = myElement.getChildren([match]);

参数:

match - (string, optional)一个CSS选择器。

(array) 元素的子元素，除了文本节点。

注意:

getChildren和getElements的区别在于,getChildren返回直接子元素,getElements返回任何深度的子元素.

Element Method: empty

清空一个元素的所有子元素。

语法:

myElement.empty();

(element)当前元素。

示例:

HTML

<div id="myElement">
    <p></p>
    <span></span>
</div>

JavaScript

$('myElement').empty();

生成的HTML

<div id="myElement"></div>

Element Method: destroy

移除元素及其子元素。

语法:

myElement.destroy();

(null)

Element Method: toQueryString

读取子input元素,生成一个查寻字符串。

语法:

var query = myElement.toQueryString();

(string)一个查寻字符串。

示例:

HTML

<form id="myForm" action="submit.php">
    <input name="email" value="bob@bob.com" />
    <input name="zipCode" value="90210" />
</form>

JavaScript

$('myForm').toQueryString(); // returns "email=bob@bob.com&zipCode=90210".

Element Method: getSelected

返回选中的select元素.

语法:

var selected = mySelect.getSelected();

(array)选中的selected元素。

示例:

HTML

<select id="country-select" name="country">
    <option value="US">United States</option
    <option value ="IT">Italy</option>
</select>

JavaScript

$('country-select').getSelected(); // returns whatever the user selected.

Element Method: getProperty

返回一个元素的属性。

语法:

var myProp = myElement.getProperty(property);

参数:

property - (string)属性名。

(string)属性值。

示例:

HTML

<img id="myImage" src="https://www.xnip.cn/wp-content/uploads/2019/07/mootoolss.jpg" title="MooTools, the compact JavaScript framework" alt="" />

JavaScript

var imgProps = $('myImage').getProperty('src'); // returns: 'mootools.png'.

Element Method: getProperties

获取多个元素属性。

语法:

var myProps = myElement.getProperties(properties);

参数:

properties - (string)任意数量要检索的属性。

(object)包含所有属性值的对象。

示例:

HTML

<img id="myImage" src="mootools.png" title="MooTools, the compact JavaScript framework" alt="" />

JavaScript

var imgProps = $('myImage').getProperties('id', 'src', 'title', 'alt');
// returns: { id: 'myImage', src: 'mootools.png', title: 'MooTools, the compact JavaScript framework', alt: '' }

Element Method: setProperty

设置元素的属性。

参数:

property - (string) 属性名
value - (mixed) 属性值

(element) - 当前元素。

示例:

HTML

<img id="myImage" />

JavaScript

$('myImage').setProperty('src', 'mootools.png');

生成的HTML

<img id="myImage" src="mootools.png" />

注:

使用此方法设置属性,传入属性小写,简化的形式.
- 用'for'代替'htmlFor'
- 用'class'代替'className'
- 用'frameborder'代替'frameBorder'
- 等...
设置图像src属性时请先移除width,和height属性.

Element Method: setProperties

为元素设置多个属性。

参数:

properties - (object) 一个对象。

(element)当前元素。

示例:

HTML

<img id="myImage" />

JavaScript

$('myImage').setProperties({
    src: 'whatever.gif',
    alt: 'whatever dude'
});

生成的HTML

<img id="myImage" src="whatever.gif" alt="whatever dude" />

Element Method: removeProperty

移除元素的属性。

语法:

myElement.removeProperty(property);

参数:

property - (string)要移除的属性。

(element)当前元素。

示例:

HTML

<a id="myAnchor" href="#" onmousedown="alert('click');"></a>

JavaScript

//Eww... inline JavaScript is bad! Let's get rid of it.
$('myAnchor').removeProperty('onmousedown');

生成的HTML

<a id="myAnchor" href="#"></a>

Element Method: removeProperties

移除元素多个属性。

语法:

myElement.removeProperties(properties);

参数:

properties - (strings)要移除的属性，之间用逗号隔开。

(element)当前元素。

示例:

HTML

<a id="myAnchor" href="#" title="hello world"></a>

JavaScript

$('myAnchor').removeProperties('id', 'href', 'title');

生成的HTML

<a></a>

Element Method: store

存储数据.

语法:

myElement.store(key, value);

参数:

key - (string)要存储数据的键。
value - (mixed)要存数据的值。

(element)当前元素。

例如:

$('element').store('someProperty', someValue);

Element Method: retrieve

检索存储的数据。

语法:

myElement.retrieve(key[, default]);

参数:

key - (string) 检索的键。
default - (mixed, optional) 哪果没找到返回的默认值。

(mixed)值。

例如:

$('element').retrieve('someProperty'); // returns someValue (see example above)

Element Method: eliminate

删除元素中存储一个数据。

语法:

myElement.eliminate(key);

参数:

key - (string) 要删除数据的键。

(mixed)当前元素

例如:

$('element').eliminate('someProperty');

Object: Element.Properties

此函数包含函数,用以响应Element:get, Element:set 和 Element:erase的第一个参数.

添加自定义元素属性

Element.Properties.disabled = {
 
    get: function(){
        return this.disabled;
    },
 
    set: function(value){
        this.disabled = !!value;
        this.setAttribute('disabled', !!value);
    }
 
};

使用自定义元素属性

// gets the "disabled" property
$(element).get('disabled');
// sets the "disabled" property to true, along with the attribute
$(element).set('disabled', true);

使用一个对象:

此外,你可以进入自定义getters和setters用一个对象作为set函数的参数.

例如:

// using set:
$(divElement).set({html: 'Hello People!', style: 'background:red'});
 
// for new Elements (works the same as set):
new Element('input', {type: 'checkbox', checked: true, disabled: true});

Element Property: html

Setter

设置元素的innerHTML 。

语法:

myElement.set('html', html);

参数:

html - (string)字符串。

(element)当前元素。

示例:

HTML

<div id="myElement"></div>

JavaScript

$('myElement').set('html', '<div></div><p></p>');

生成的HTML

<div id="myElement">
    <div></div>
    <p></p>
</div>

Getter

返回元素的innerHTML。

语法:

myElement.get('html');

(text)这个元素的innerHTML。

Element Property: text

Setter:

设置元素的内部文本。

语法:

myElement.set('text', text);

参数:

text - (string)文本内容。

(element)当前元素。

示例:

HTML

<div id="myElement"></div>

JavaScript

$('myElement').set('text', 'some text');
// the text of myElement is now 'some text'.

生成的HTML

<div id="myElement">some text</div>

Getter:

获取元素的内部文本。

语法:

var myText = myElement.get('text');

(string)元素的文本。

示例:

HTML

<div id="myElement">my text</div>

JavaScript

var myText = $('myElement').get('text'); // myText = 'my text'.

Element Property: tag

Getter:

返回小写的元素名称。

语法:

var myTag = myElement.get('tag');

(string)小写的标签名称。

示例:

HTML

<img id="myImage" />

JavaScript

var myTag = $('myImage').get('tag'); // myTag = 'img'

Type: IFrame

IFrame对象。

IFrame Method: constructor

创建一个iframe元素,并转化成MooTools对象。

语法:

var myIFrame = new IFrame([el][, props]);

参数:

el - (mixed, optional) iframe的id或,iframe元素,如果没有传入,将创建一个新的iframe.
props - (object, optional) 新元素的属性。

(element)新的IFrame元素。

示例:

var myIFrame = new IFrame({
 
    src: 'http://mootools.net/',
 
    styles: {
        width: 800,
        height: 600,
        border: '1px solid #ccc'
    },
 
    events: {
 
        mouseenter: function(){
            alert('Welcome aboard.');
        },
 
        mouseleave: function(){
            alert('Goodbye!');
        },
 
        load: function(){
            alert('The iframe has finished loading.');
        }
 
    }
 
});

Type: Elements

Elements类。

Elements Method: constructor

语法:

var myElements = new Elements(elements[, options]);

参数:

elements - (mixed) 一个元素集合。

(array) 一个元素组合。

示例:

设置每个段落的颜色为红色:

$$('p').each(function(el){
    el.setStyle('color', 'red');
});
 
// Because $$('myselector') also accepts Element methods, the below
// example has the same effect as the one above.
$$('p').setStyle('color', 'red');

创建一个Elements从数组:

var myElements = new Elements(['myElementID', $('myElement'), 'myElementID2', document.getElementById('myElementID3')]);

注意事项:

在MooTools的，每一个DOM函数返回节点集合的函数,返回为Elements的实例(如$$函数)。
因为Elements是一个array-like对象，所以它接受所有的Array的方法，但优先使用Element和Elements的方法。
Elements的每一个节点是一个Element对象。

Elements Method: append

追加节点,返回当前对象。

语法:

elements.append(collection);

参数:

collection - (array)一个元素数组。

(array)当前元素集合。

注意事项:

此方法不用document.id处理节点。

Elements Method: concat

追加节点,返回新对象。

语法:

var newElements = elements.concat(element[, list, id, ...]]);

参数:

element - (mixed) 一个html元素,或一个id 。
list, id, ... - (mixed) 一元素数组，或id数组。

(array)一种新的Elements数组。

Elements Method: empty

从Elements数组中删除每一个项目，并清空数组。

语法:

elements.empty();

(array)这个空元素的数组。

注意:

Elements.empty销毁里面的元素,如果你不再使用此元素,你应该销毁它.例如:

$$('div').destroy().empty();

<h2Elements Method: filter用css选择器过滤一个元素集合.与Array:filter相似.

语法:

var filteredElements = elements.filter(selector);

参数:

selector - (mixed) 一个css选择器,或一个过滤函数

(array) 当前元素集合的一个子集

Elements Method: push

追加一个元素,或一个元素集合,返回追加后的长度.

语法:

var length = elements.push(element[, id, ...]]);

参数:

element - (mixed)一个元素,或一个元素的id.
id, ... - (mixed)额外的元素,或元素id(多个用逗号隔开)

(number)追加后数组的长度.

Elements Method: unshift

从前面增加一元素,或一元素集合.返回追加后的长度.

语法:

var length = elements.unshift(element[, id, ...]]);

参数:

element - (mixed)一个元素,或一个元素的id.
id, ... - (mixed)额外的元素,或元素id(多个用逗号隔开)

追加后集合的长度.

Element

Type: Window

Function: document.id

语法:

参数:

返回:

示例:

通过ID取得元素:

通过元素引用:

Function: $

示例:

Function: $$

语法:

参数:

返回:

示例:

通过标签名:

通过多个元素实例:

通过一个元素集合:

通过CSS选则器:

Type: Element

Element Method: constructor

语法:

参数:

返回:

示例:

注意:

Element Method: getElement

语法:

参数:

返回:

示例:

注意事项:

Element Method: getElements

语法:

参数:

返回:

示例:

注意事项:

Element Method: getElementById

语法:

参数:

返回:

示例:

注意事项:

Element Method: set

语法:

参数:

返回:

示例:

两个参数:

一个参数:

Element Method: get

语法:

参数:

返回:

示例:

用自定义Getters:

取得原生元素属性:

Element Method: erase

语法:

参数:

返回:

示例:

注意:

Element Method: match

语法:

参数:

返回:

示例:

用一个标签:

用CSS选择器:

用一个元素:

Element Method: contains

语法:

参数:

返回:

示例:

HTML

JavaScript

Javascript
myFirstElement.inject(mySecondElement);