chrome browser开发者工具介绍

• Elements标签页可以查看、编辑DOM元素。
  
• Network标签页上可以查看HTTP请求以及回复报文的详信息，包括HTTP回应码、POST时提交的表单等
• Sources标签页，设断点调试时会跳到这里当茬js脚本里加debug关键字设置断点时，会用到
• Audits标签页，没用过
• Console标签页，在这里可以手工注入额外的脚本在当前页面环境下执行。另外/user/index.html

  打开該页面后调出开发者工具，然后右键对准“保存联系人”按钮按下并松开在弹出的菜单中选择审察元素。

  这时自动跳转到Elements标签页定位到该元素的HTML代码并高亮显示。

  可以看到该元素添加了onclick事件的响应代码“books_add()”

  同样的原理可以得到姓名文本输入框的id为fname, 号码文本输入框的id為fphone。

  通过查看页面源码得知该页面包含了jQuery-1.8.3. 因此测试用Javascript代码如下：

  将上述四行代码合并成一行复制粘贴到Console标签页中并回车，那么这四条代碼就被注入执行了

  可以发现成功地上传了一条指定的通讯录条目。

  至于如何从简单的csv文本中提取出姓名与号码并生成js数组就不赘述了，随便用你拿手的某种语言写都行