1）需要确认整个页面（含各种链接资源）加载完毕后才执行，需要用js的onload事件。

<script>

window.onload = function(){

//回调函数

}

</script>

2）确认某一个资源加载完毕后执行，用id的onload事件

<img id="sugar_img" src="sugar.jpg">

<script>
sugar_img.onload = function(){//回调函数
}
<script>

测试发现，如果有两个元素是同一个id，则回调会失败。

3）上述资源回调的另一种写法：

<img onload="sugar_img()" id="sugar_img" src="sugar.jpg">

<script>
sugar_img = function(){//回调函数
}
<script>

4) 如果只是DOM加载完毕就执行，可以用jquery的$.ready()

HTML布局无疑是HTML+CSS了。另外使用jquery或vue.js更可以使得布局方便灵活；进一步的，CSS还有各种变体，LESS、stylus等让布局更方便。

Windows的C#，似乎力推的是WPF（XAML），用XML形式描述布局，而不是用C#语句一个个去创建和定义，应该方便了很多。

跨界，WxWidgets，支持不同操作系统和不同语言，如python、ruby。然而是使用程序的方式制造界面，并不喜欢。

1）安卓手机打开USB调试模式；

2）PC用USB连接安卓手机，驱动什么都装好；

3）PC端Chrome中输入：

chrome://inspect

这时应该已经看到了手机连接上了。

4）手机端用Chrome开启网页，这时候在PC端chrome上应该已经看到了手机上的网页名称；

5）PC Chrome上点击要调试的网页下面的inspect，开始调试

基于node.js、chromium的本地app开发框架electron，官方有三步安装使用法：

# Clone the Quick Start repository
$ git clone https://github.com/electron/electron-quick-start

# Go into the repository
$ cd electron-quick-start

# Install the dependencies and run
$ npm install && npm start

在npm install这一步，经常会出现下载出问题，如果是windows 10，将下载类似“electron-v1.4.3-win32-x64.zip”这样的文件，大约50MB，经常下一半就断了，下次还要重新来过。

这时候需要设置系统环境变量：

ELECTRON_MIRROR="https://npm.taobao.org/mirrors/electron/"

如果是windows，在“系统”-》“高级系统设置”-》“环境变量”-》“系统变量”-》“新增”中增加即可。

如果是linux，设置：

export ELECTRON_MIRROR="https://npm.taobao.org/mirrors/electron/"