小编Hum*_*ood的帖子

我的任务是在不使用任何库(如jQuery或原型)的情况下在文档上触发自定义事件.

所以我对Firefox这样做很好:

function fireCustomEvent(eventData)
{
    if (document.createEvent)   // Firefox
    {
        var event = document.createEvent('HTMLEvents');    // create event
        event.initEvent('myCustomEvent', true, true );     // name event
        event.data = eventData;                            // put my stuff on it
        document.dispatchEvent(event);                     // fire event
    }
    else if (document.createEventObject)    // IE
    {
        xxxxxxxxxxx
    }
}

现在我可以像这样开火:

fireCustomEvent({
    category: 'test',
    value: 123
});

并像这样捕获它(这里我可以使用jQuery):

$(document).bind('myCustomEvent', function (event) {
    doStuff(event);
});

我的问题是,我可以做些什么来使这项工作在IE上(换句话说,我把xxxxxxxxxxx放在哪里)？

我认为IE等效应该看起来像这样:

 var event = document.createEventObject();
 event.data = eventData;
 document.fireEvent('myCustomEvent', event);

但这不起作用.IE让我只使用预定义的事件名称(onclick等),甚至其中一些不起作用(例如onmessage)

任何帮助或想法表示赞赏!

我正在使用带有Python 2.7的Google App Engine,我正在尝试将svg文件用作精灵表.

出于某种原因,这适用于Win7和Ubuntu,但不适用于Vista或Mac(在每种情况下使用最新的Chrome和Firefox).

这里用mime-type"application/octet-stream"发送,浏览器提示下载它,而不是显示它.

我尝试在我的app.yaml中覆盖mime-type,如下所示:

- url: /img/.*\.svg
  static_dir: public/img
  mime_type: image/svg+xml

- url: /img
  static_dir: public/img

但这并没有改变任何事情.

我还试图通过他们自己的url路由svg文件的请求

- url: /img/svg
  static_dir: public/img
  mime_type: image/svg+xml

- url: /img
  static_dir: public/img

但这导致文件与mime-type"img/png"一起发送,因此浏览器至少会尝试显示它,但不能.

只是为了确保,我按照说明尝试了每个组合,并且还使用了header-options:

- url: /img/svg
  static_dir: public/img
  http_headers:
    mime-type: image/svg+xml

没有成功.

有什么帮助吗？

[编辑]

经过一些更多的测试后,似乎在Ubuntu上使用本地app-launcher,它会text/html在部署时使用svg发送它application/octet-stream,无论我在app.yaml中放置什么.

有没有人有这方面的经验？我能解决这个问题的唯一方法是直接将svg代码插入到页面中,这有点糟糕.这是一个图形,我想以这种方式对待它.

[更多编辑]

最后,我把它放在yaml文件中,它似乎工作:

- url: /img/.*\.svg
  static_dir: public/img
  http_headers:
    content_type: image/svg+xml

- url: /img
  static_dir: public/img

假设我有许多按钮.每个按钮都有一个不同的图标,但都来自同一个精灵表.

现在我想知道的是,浏览器方面更有效率.通过多个小规则设置每个按钮,如下所示:

.icon {
    background-image: url('iconsheet.png');
}
.a-button {
    background-position: -x -y;
}
.b-button {
    background-position: -x -y;
}
.c-button { ...

<input class="icon a-button"> blabla ...

或者这更好:

.a-button {
    background-image: url('iconsheet.png');
    background-position: -x -y;
}
.b-button {
    background-image: url('iconsheet.png');
    background-position: -x -y;
}
.c-button {
    background-image: url('iconsheet.png');
    background-position: -x -y;
}

<input class="a-button"> blabla ...

请注意

1. 代码是在程序上创建的,所以我只对解析,渲染等效果感兴趣,而不是最好的编码实践.
2. 这只是一个玩具设置.实际上,在游戏中有更多不同属性的组合(边框,字体等).

只有少数臃肿的规则适用于每个标签会超过必须提供更大的CSS文件吗？

非常感谢!!

[编辑]:到目前为止,感谢您的所有答案!为了澄清,我正在使用SASS/SCSS.我正在使用的*.scss文件很好,可读性/可维护性.

我特别感兴趣的是,每个标签具有更少的单个规则是否有性能优势,这使得在最后拥有bazillion-line css文件是可以接受的.

该express-generator工具创建一个名为 的文件bin/www并将其用作应用程序的主要入口点。我相信我已经看到其他几个模块也这样做了，但绝大多数只是使用index.js.

这背后的理由是什么？当然，我理解为什么您要将服务器和用于设置程序的代码拆分为单独的模块，但为什么bin/www而不呢index.js？为什么将主入口点嵌套到比它调用的内容更深两层的程序中？并删除文件扩展名，使其更加缺乏描述性？