将Mootools 1.3元素添加到文档主体

Question

我已经尝试使用注入，采用和抓取方法将我的新元素插入到文档主体中，但它似乎没有工作。

我真正想要它做的是创建一个新的div，显示在身体的所有其他元素的顶部。我已经在之前的mootools迭代中工作，但是我无法在1.3版本中使用它。

只是想我会看看是否有人在这里有一些想法可以帮助，干杯！

var overlay = new Element('div', { 
    'class': 'overlay', 
    styles: { 
     display: 'block', 
     visibility: 'visible', 
     position: 'fixed', 
     background-color: '#4E5056', 
     z-index: 65555, 
     height: '100%', 
     width: '100%', 
     top: 0, 
     left: 0 
    } 
    }); 

    $(document.body).inject(overlay); 

Answer 1

您可以使用jshint/jslint获益。

你不能离开background-color和z-index那样，在它们周围使用“”或使用backgroundColor和zIndex的脚本版本。

输出的JSLint的：

Error:

Problem at line 7 character 17: Expected ':' and instead saw '-'.

background-color: '#4E5056',

Problem at line 7 character 23: Expected '}' to match '{' from line 3 and instead saw ':'.

background-color: '#4E5056',

Problem at line 7 character 25: Expected '}' to match '{' from line 1 and instead saw '#4E5056'.

background-color: '#4E5056',

Problem at line 8 character 14: Expected ')' and instead saw ':'.

z-index: 65555,

Problem at line 8 character 15: Missing semicolon.

z-index: 65555,

Problem at line 8 character 16: Expected an assignment or function call and instead saw an expression.

z-index: 65555,

Problem at line 8 character 21: Missing semicolon.

z-index: 65555,

Problem at line 8 character 21: Expected an identifier and instead saw ','.

z-index: 65555,

Problem at line 8 character 21: Stopping, unable to continue. (53% scanned).

你没有一个调试器？在Firefox中铬/ WebKit的或萤火虫网络检查清楚地显示了异常：

missing : after property id 
[Break On This Error] background-color: '#4E5056', 

最后，注射：

element.inject(document.body); 
// or 
$(document.body).adopt(element); 

看的jsfiddle太：http://jsfiddle.net/dimitar/SW3pK/

您可以点击JSLint的按钮那里也要验证代码。

Answer 2

你必须使用：

overlay.inject(document.body); 

http://mootools.net/docs/core/Element/Element#Element:inject

你也应该在'总是写属性或“像贝尔巴托夫说

例：

{ 
    'display': 'block', 
    'background-color': '#F00' 
}