Question

我尝试使用inject，adopt和grab方法将我的新元素插入到文档正文中，但它似乎没有用。

我真正想要它做的是创建一个新的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的输出：

错误：

第7行第17个问题：   预期'：'而是看到' - '。

background-color：'＃4E5056'，

第7行第23个问题：   预期'}'匹配第3行的'{'   而是看到'：'。

background-color：'＃4E5056'，

第7行第25个问题：   预期'}'匹配第1行的'{'   而是看到'＃4E5056'。

background-color：'＃4E5056'，

第8行第14个问题：   预期'）'而是看到'：'。

z-index：65555，

第8行第15个问题：   缺少分号。

z-index：65555，

第8行第16个问题：   预期任务或职能   打电话，而是看到一个表达。

z-index：65555，

第8行第21个问题：   缺少分号。

z-index：65555，

第8行第21个问题：   期待一个标识符，而不是看到   ''

z-index：65555，

第8行第21个问题：   停止，无法继续。（53％   扫描）。

你没有调试器吗？ chrome / webkit中的web检查器或firefox中的firebug清楚地显示了异常：

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

你也应该像Dimitar所说的那样在'或'中写下属性。

示例：

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

将Mootools 1.3元素添加到文档正文

2 个答案: