当前位置:文档之家› webstorm快捷键说明

webstorm快捷键说明

webstorm快捷键说明
webstorm快捷键说明

webstorm快捷键说明

Editing编辑相关快捷键

?Ctrl + Space:

Basic code completion (the name of any class, method or variable) 基本代码完成(任何类、函数或者变量名称),改为Alt+S

?Ctrl + Shift + Enter:

Complete statement 补全当前语句

?Ctrl + P:

Parameter info (within method call arguments) 参数信息包括方法调用参数

?Ctrl + mouse over code

Brief Info 简单信息

?Ctrl + F1

Show description of error or warning at caret 显示光标所在位置的错误信息或者警告信息

?Alt + Insert

Generate code…(Getters, Setters, Constructors)新建一个文件或者生成代码,…构造函数,可以创建类里面任何字段的getter与setter方法

?Ctrl + O

Override methods 重载方法

?Ctrl + I

Implement methods 实现方法

?Ctrl + Alt + T

Surround with…(if, else, try, catch, for, etc)用* 来围绕选中的代码行,(* 包括if 、while 、try catch 等)

?Ctrl + /

Comment/uncomment with line comment 行注释/取消行注释

?Ctrl + Shift + /

Comment/uncomment with block comment 块注释/取消块注释

?Ctrl + W

Select successively increasing code blocks 选择代码块,一般是增量选择

?Ctrl + Shift + W

Decrease current selection to previous state 上个快捷键的回退,减量选择代码

?Alt + Q

Context info 上下文信息

?Alt + Enter

Show intention actions and quick-fixes 意图行动,快速见效

?Ctrl + Alt + L

Reformat code 根据模板格式对代码格式化

?Tab/ Shift + Tab

Indent/unindent selected lines 对所选行进行缩排处理/撤销缩排处理

?Ctrl + X or Shift + Delete

Cut current line or selected block to clipboard 剪切当前行或所选代码块到剪切板

?Ctrl + C or Ctrl + Insert

Copy current line or selected block to chipboard 拷贝当前行或者所选代码块到剪切板

?Ctrl + V or Shift + Insert

Paste from clipboard 粘贴剪切板上的内容

?Ctrl + Shift + V

Paste from recent buffers 粘贴缓冲器中最新的内容

?Ctrl + D

Duplicate current line or selected block 复制当前行或者所选代码块

?Ctrl + Y

Delete line at caret 删除光标所在位置行

?Ctrl + Shift + J

Smart line join(HTML and JavaScript only)加入智能行(HTML 和JavaScript)?Ctrl + Enter

Smart line split(HTML and JavaScript only)分离智能行(HTML 和JavaScript)?Shift + Enter

Start new line 另起一行

?Ctrl + Shift + U

Toggle case for word at caret or selected block 光标所在位置大小写转换

?Ctrl + Shift + ]/[

Select till code block end/start 选择直到代码块结束/开始

?Ctrl + Delete

Delete to word end 删除文字结束

?Ctrl + Backspace

Delete to word start 删除文字开始

?Ctrl + NumPad+/-

Expand/collapse code block 扩展/缩减代码块?Ctrl + Shift+ NumPad+

Expand all 扩张所有

?Ctrl + Shift+ NumPad-

Collapse 缩减所有

?Ctrl + F4

Close active editor tab 关闭活跃编辑标签Search/replace搜索/替代相关快捷键

?Ctrl + F

Find 当前文件内快速查找代码

?Ctrl + Shift + F

Find in path 指定文件内寻找路径

?F3

Find next 查找下一个

?Shift + F3

Find previous 查找上一个

?Ctrl + R

Replace 当前文件内代码替代

?Ctrl + Shift + R

Replace in path 指定文件内代码批量替代

Usage Search搜索相关快捷键

?Alt + F7/Ctrl + F7

Find usages/Find usages in file 找到使用/在文件找到使用?Ctrl + Shift + F7

Highlight usages in file文件中精彩使用

?Ctrl + Alt + F7

Show usages 显示使用

Running运行

?Alt + Shift + F10

Select configuration and run 选择构架,运行

?Alt + Shift + F9

Select configuration and debug 选择构架,修补漏洞

?Shift + F10

Run 运行

?Shift + F9

Debug 修补漏洞

?Ctrl + Shift + F10

Run context configuration from editor 从编辑运行内容构架

?Ctrl + Shift + X

Run command line 运行命令行Debugging Debugging相关快捷键?F8

Step over 不进入函数

?F7

Step into 单步执行

?Shift + F7

Smart step into 智能单步执行

?Shift + F8

Step out 跳出

?Alt + F9

Run to cursor 运行到光标处

?Alt+ F8

Evaluate expression 评估表达

?F9

Resume program 重新开始程序?Ctrl + F8

Toggle breakpoint 切换断点

?Ctrl + Shift + F8

View breakpoints 查看断点Navigation 定位相关快捷键

?Ctrl + N

Go to class跳转到指定类

?Ctrl + Shift + N

Go to file 通过文件名快速查找工程内的文件

?Ctrl + Alt +Shift + N

Go to symbol 通过一个字符查找函数位置

?Alt + Right/ left

Go to next/ previous editor tab 进入下一个/ 上一个编辑器选项?F12

Go back to previous tool window 进入上一个工具窗口

?Esc

Go to editor(from tool window)从工具窗口进入编辑器

?Shift + Esc

Hide active or last active window 隐藏活动窗口

?Ctrl + Shift + F4

Close active run/message/find/…tab 关闭活动….标签

?Ctrl + G

Go to line 跳转到第几行

?Ctrl + E

Recent files popup 弹出最近打开的文件

?Ctrl + Alt + Left/Right

Navigate back/forward 导航前进/后退

?Ctrl + Shift + Backspace

Navigate to last edit location 向最近编辑定位导航

?Alt + F1

Select current file or symbol in any view 查找当前选中的代码或文件在其他界面模块的位置

?Ctrl + B or Ctrl + Click

Go to declaration跳转到定义处

?Ctrl + Alt + B

Go to implementation(s) 跳转方法实现处

?Ctrl + Shift + B

Go to type declaration 跳转方法定义处

?Ctrl + Shift + I

Open quick definition lookup 打开定义快速查找

?Ctrl + U

Go to super-method/super-class 跳转方法/超阶级

?Alt + Up/Down

Go to previous/next method 在方法间快速移动定位

?Ctrl + ]/[

Move to code block end/start 跳转到编码块结束/开始

?Ctrl + F12

File structure popup 文件结构弹出

?Ctrl + H

Type hierarchy 类型层次

?Ctrl + Alt + H

Call hierarchy 调用层次结构

?F2/ Shift + F2

Next/previous highlighted error 跳转到后一个/前一个错误,高亮错误或警告快速定位,使用这个快捷键可以快捷在出错的语句之间进行跳转。

?F4/Ctrl + Enter

Edit source/ View source 编辑源代码/查看源代码

?Alt + Home

Show navigation bar 显示导航栏

?F11

Toggle bookmark 切换标记

?Ctrl + F11

Toggle bookmark with mnemonic 采用记忆切换标记

?Ctrl + #[0-9]

Go to numbered bookmark 跳转到带编号的标记

?Shift + F11

Show bookmark 显示标记

Refactoring 重构相关快捷键

?F5

Copy 拷贝

?F6

Move 移动

?Alt + Delete

Safe Delete 安全删除

?Shift + F6

Rename 重新命名

?Ctrl + Alt + N

Inline Variable 嵌入变量

?Ctrl + Alt + M

Extract Method( Javascript only) 提取函数

?Ctrl + Alt + V

Introduce Variable 引入变量

?Ctrl + Alt + F

Introduce Field 引入域

?Ctrl + Alt + C

Introduce Constant 引入常量

VCS/Local History 版本控制系统/ 本地历史相关快捷键?Alt + BackQuote( )

‘VCS’quick popup 快速弹出VCS

?Ctrl + K

Commit project to VCS 提交项目至VCS

Update project from VCS 从VCS 更新项目

?Alt + Shift + C

View recent changes 查看最新改变

General 常用的相关快捷键

?Ctrl + Shift +A

Find action 查找并调用编辑器的功能

?Alt + #[0-9]

Open corresponding tool window 快速切换打开界面模块

?Ctrl + Alt + F11

Toggle full screen mode 切换全屏模式

?Ctrl + Shift + F12

Toggle maximizing editor 切换最大化编辑器

?Alt + Shift + F

Add to Favorites 将当前文件添至收藏夹

?Alt + Shift + I

Inspect current file with current profile 使用当前属性检查当前文件?Ctrl + BackQuote( )

Quick switch current scheme 快速转换现有组合

?Ctrl + Alt + S

Open setting dialog 打开设置对话框

Switch between tabs and tool window 标签和工具窗的转换(与windows快捷键冲突)

JavaScript开发工具WebStorm教程

JavaScript开发工具WebStorm教程:用户界面简介 概述:WebStorm是一款优秀的JavascriptIDE,在本文中将简要介绍一下WebStorm的用户界面,帮助用户通过自己的工作环境找到合适的工作方式。 ?JavaScript开发工具WebStorm教程:用户界面简介 ?JavaScript开发工具WebStorm教程:WebStorm工具窗口 ?JavaScript开发工具WebStorm教程:配置个人文件编码 ?JavaScript开发工具WebStorm教程:IntelliLang使用示例 ?JavaScript开发工具WebStorm教程:创建和优化导入 ?JavaScript开发工具WebStorm教程:XSLT 支持 WebStorm是一款优秀的Javascript IDE,在本文中将简要介绍一下WebStorm的用户界面,帮助用户通过自己的工作环境找到合适的工作方式。 当用户第一次运行WebStorm或者没有打开项目,在WebStorm显示的欢迎屏幕上,可以快速访问的主要入口点。当打开了一个项目的时候,WebStorm 会显示主窗口,该窗口有六个逻辑领域,分别是菜单、工具栏、导航栏、状态栏、编辑器、WebStorm 工具窗口,如下图所示,图中已用红色的标签标示:

欢迎界面 在WebStorm显示的欢迎界面上,这时还没有项目打开。从这个屏幕上,你可以快速访问WebStorm的主要起始点。当你在WebStorm唯一实例中关闭当前项目时,就会出现欢迎界面。如果说你正在运行多个项目的话,关闭一个项目将会导致关闭项目运行的WebStorm窗口,除了最后一个。

H5前端开发学习笔记

H5前端开发学习笔记 1、在W3C中查询不到但各大浏览器普遍支持的标签: 名称:marquee,跑马灯标签。文字和图片均可以使用 用法: 属性:behavior,内容遇到边界时的运动方式,slide停在边界处,alternate从边界处弹回; direction,内容运动的方向,left\right\up\down,代表左、右、上、下 scrollamount,内容运动的速度 loop,内容运动的次数 2、Html中的标签是用于定义语义的,这是非常重要的概念,在学习过程中,一定只关注语义,不要关注样式 3、很多以前常用的标签已经被废弃了,要特别注意,如
\


\\\\\等标签,大都不是定义语义,而是定义格式或样式的。这些标签现在常用于CSS的钩子 4、Html推出了部分替代标签,分别是:strong=b、ins=u、em=i、del=s。strong定义重要性强调的文字;ins定义插入的文字;em(emphasized)定义强调的意义,但重要性弱于strong;del定义被删除的文字 5、CSS中常见的文字属性,如果属性值是中文,一定要用单引号或双引号 样式:font-style 粗细:font-weight,单词取值,数字取值 大小:font-size 字体:font-family。可以设置备选方案,如:‘“乱字”,“宋体”’格式,如果中英文混合录入,则在前面设置英文字体,后面设置中文字体,如‘arial,“微软雅黑”’格式,一定要英文在前,中文在后 字体属性可以一次性赋值,格式:slyle weight size family,如:font: italic bold 10px “宋体”,每个值间加空格,但size和family不能省略,并且size必须在前面,family必须在后面 6、CSS中常见的文本属性。decoration代表装饰线,align代表水平对齐,indent代表缩进,常用单位为em,代表字符 7、CSS中的颜色属性。直接命名,如red;rgb(),rgba(),#(16进制),#(16进制的缩写),在前端开发中,不建议大面积使用黑色,因为亮度太高,刺眼,建议使用深灰色,rgba中的a代表透明度 8、id选择器和类选择器,id选择器前面一定要加“#”号,命名时只允许使用字母、数字和下划线,且不能以数字开头,不能是标签的名称;不建议使用id,因为js中会使用;类选择器前面一定要加“.”,是专门给标签设置样式的,每个标签可以同时绑定多个类,格式如:class=”类1 类2 ……”,不能写成:class=”类1” class=”类2”,要巧用多个类的方式,从而减少重复代码量,把一些公共的样式写进类里,这样可以让代码的冗余量降低 9、后代选择器,格式:标签1 标签2{属性:值;},类名和标签名称可以结合使用,如:.class p{} 10、子元素选择器,标签的直接子元素,格式:标签1>标签2{},只到直接下级,不会到下下一级,一定要>符号连接,不能有空格,可以用类和标签混合,可以无限向下 11、后代选择器相对泛一些,子元素选择器定位比较精准 12、交集选择器。标签.选择器1选择器2{},选择器与选择器间没有连接符号,如:p.one1{},可以是标签、类混合

webstorm快捷键说明

webstorm快捷键说明 Editing编辑相关快捷键 ?Ctrl + Space: Basic code completion (the name of any class, method or variable) 基本代码完成(任何类、函数或者变量名称),改为Alt+S ?Ctrl + Shift + Enter: Complete statement 补全当前语句 ?Ctrl + P: Parameter info (within method call arguments) 参数信息包括方法调用参数 ?Ctrl + mouse over code Brief Info 简单信息 ?Ctrl + F1 Show description of error or warning at caret 显示光标所在位置的错误信息或者警告信息 ?Alt + Insert Generate code…(Getters, Setters, Constructors)新建一个文件或者生成代码,…构造函数,可以创建类里面任何字段的getter与setter方法 ?Ctrl + O Override methods 重载方法 ?Ctrl + I Implement methods 实现方法

?Ctrl + Alt + T Surround with…(if, else, try, catch, for, etc)用* 来围绕选中的代码行,(* 包括if 、while 、try catch 等) ?Ctrl + / Comment/uncomment with line comment 行注释/取消行注释 ?Ctrl + Shift + / Comment/uncomment with block comment 块注释/取消块注释 ?Ctrl + W Select successively increasing code blocks 选择代码块,一般是增量选择 ?Ctrl + Shift + W Decrease current selection to previous state 上个快捷键的回退,减量选择代码 ?Alt + Q Context info 上下文信息 ?Alt + Enter Show intention actions and quick-fixes 意图行动,快速见效 ?Ctrl + Alt + L Reformat code 根据模板格式对代码格式化 ?Tab/ Shift + Tab Indent/unindent selected lines 对所选行进行缩排处理/撤销缩排处理 ?Ctrl + X or Shift + Delete Cut current line or selected block to clipboard 剪切当前行或所选代码块到剪切板

最全的webstorm快捷键

Editing编辑 Ctrl + Space Basic code completion (the name of any class, method or variable) 基本代码完成(任何类、函数或者变量名称),改为Alt+S Ctrl + Shift + Enter Complete statement 补全当前语句 Ctrl + P Parameter info (within method call arguments) 参数信息包括方法调用参数 Ctrl + mouse over code Brief Info 简单信息 Ctrl + F1 Show description of error or warning at caret 显示光标所在位置的错误信息或者警告信息 Alt + Insert Generate code…(Getters, Setters, Constructors)生成代码,…构造函数,可以创建类里面任何字段的getter与setter方法Ctrl + O Override methods 重载方法 Ctrl + I Implement methods 实现方法 Ctrl + Alt + T Surround with…(if, else, try, catch, for, etc)用* 来围绕选中的代码行,(* 包括if 、while 、try catch 等) Ctrl + / Comment/uncomment with line comment 行注释/取消行注释 Ctrl + Shift + / Comment/uncomment with block comment 块注释/取消块注释 Ctrl + W Select successively increasing code blocks 选择代码块,一般是增量选择 Ctrl + Shift + W Decrease current selection to previous state 上个快捷键的回退,减量选择代码 Alt + Q Context info 上下文信息 Alt + Enter Show intention actions and quick-fixes 意图行动,快速见效 Ctrl + Alt + L Reformat code 根据模板格式对代码格式化 Tab/ Shift + Tab Indent/unindent selected lines 对所选行进行缩排处理/撤销缩排处理 Ctrl + X or Shift + Delete Cut current line or selected block to clipboard 剪切当前行或所选代码块到剪切板 Ctrl + C or Ctrl + Insert Copy current line or selected block to chipboard 拷贝当前行或者所选代码块到剪切板 Ctrl + V or Shift + Insert Paste from clipboard 粘贴剪切板上的内容 Ctrl + Shift + V Paste from recent buffers 粘贴缓冲器中最新的内容 Ctrl + D Duplicate current line or selected block 复制当前行或者所选代码块 Ctrl + Y Delete line at caret 删除插入符号位置行 Ctrl + Shift + J Smart line join(HTML and JavaScript only)加入智能行(HTML 和JavaScript) Ctrl + Enter Smart line split(HTML and JavaScript only)分离智能行(HTML 和JavaScript) 以上快捷键是根据webstrom官网给出的pdf翻译而来(只整理了windows下的)

webstorm、phpstorm、idea等使用技巧

概述 此文章用来记录jetbrain系列工具使用的小技巧。如果没有特别说明的话,这些技巧在webstorm、phpstorm、idea中是通用且是跨平台的。 live edit功能与浏览器实现同步实现步骤 live edit是一个免刷新的功能,能捕捉到页面的改动(css、html、js改动),然后浏览器自动刷新,这样提高了开发的效率。很赞的一个功能,唯一不足的是,要安装JB插件到浏览器中,对于不能安装该插件的浏览器来说,该功能就鸡肋了。 1. 打开WebStore的设置对话框,找到live edit选项,选中Enable live editing。 2. 打开Chrome浏览器,进入Chrome网上商店,搜索JetBrains IDE Suport扩展程序。点击“添加至 Chrome“按钮,安装该扩展程序到Chrome。这时候,Chrome浏览器工具栏上就会出现一个JB图标。 注(有时可能在网上商店里搜索不到,我这里提供了一个地 址:https://https://www.doczj.com/doc/174081948.html,/webstore/detail/jetbrains-ide- support/hmhgeddbohgjknpmjagkdomcpobmllji ) 3. 在WebStorm中新建一个html文件,然后在页面内单击鼠标右键,选择debug选项。

4. 这时,webStorm会启动默认浏览器,并且激活JB浏览器插件。 5. 返回到Webstorm编辑器,尝试修改页面中的内容,然后打开浏览器,看看页面是否自动刷新了没。如 果配置正确的话,一改动代码,浏览器会立刻刷新的,这简直就是重构开发的圣器呀。webstorm内置服务器失效的问题 默认情况下,我们可以直接运行本地的html页面,它内部会开启64432端口来运行我们的页面,这样我们不要配置烦杂的后台环境,也可以简单测试一些需要服务器配合的页面了。启动服务的方式如下:

Mac下常用前端开发软件环境安装

SublimeText及插件安装 Sublime Text安装 1.准备安装程序:sublimetext.dmg 2.双击安装程序,稍后出现以下画面: 3.将“Sublime Text”拖进“Applications”,稍后 在“Launchpad”中出现程序图标: 4.点击“Sublime Text”图标进入程序,出现以 下画面即安装完成:

5.消息框提示是否更新版本,可以自行选择 6.因为是未注册版,经常会出现要求注册的 消息提示,无需理会,关闭即可 安装插件管理器Package Control 1.在联网状态下,打开“Sublime Text”后,通 过以下菜单:

或快捷键Ctrl+~(键盘左上角esc下面的那个键)打开控制台,如下: 2.将以下代码复制到输入框中后按回车键 import urllib.request,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();urll ib.request.install_opener(urllib.request.build_opener(urllib.request.Pr oxyHandler()));open(os.path.join(ipp,pf),'wb').write(urllib.request.urlo pen('https://www.doczj.com/doc/174081948.html,/'+pf.replace(' ','%20')).read()) 3.如果出现以下提示,则退出“Sublime Text” (注意是退出:?+Q,不是关闭)后再打开

WebStorm APICloud 插件的安装和使用说明(一)

WebStorm APICloud 插件的安装和使用说明(一)开源地址:https://https://www.doczj.com/doc/174081948.html,/APICloud 依赖环境:java 当前支持环境 ?WebStorm ?Windows 或Mac ?Android 和ios手机 首先下载插件 1、通过APICloud官方网站下载webStorm-APICloud.zip文件。 2、把webStorm-APICloud.zip解压到WebStorm的工作空间中。

打开WebStorm 的'External Tools'选项 Mac 点击状态栏中WebStorm ,在下拉菜单中,点击Preferences Windows

安装创建新应用插件 1.新建空白应用。在'External Tools'选项中,点击'+' 。在Create Tool中,填写如下内容: name : 新建空白应用 Program : java Parameters : -jar $ProjectFileDir$/webStorm-APICloud/webStorm_app.jar $ProjectFileDir$ $Prompt$ default

2.新建底部导航应用。在'External Tools'选项中,点击'+' 。在Create Tool中,填写如下内容: name : 新建底部导航应用 Program : java Parameters : -jar $ProjectFileDir$/webStorm-APICloud/webStorm_app.jar $ProjectFileDir$ $Prompt$ bottom 3.新建首页导航应用。在'External Tools'选项中,点击'+' 。在Create Tool中,填写如下内容: name : 新建首页导航应用 Program : java Parameters : -jar $ProjectFileDir$/webStorm-APICloud/webStorm_app.jar $ProjectFileDir$ $Prompt$ home 4.新建侧边导航应用。在'External Tools'选项中,点击'+' 。在Create Tool中,填写如下内容: name : 新建侧边导航应用 Program : java Parameters : -jar $ProjectFileDir$/webStorm-APICloud/webStorm_app.jar $ProjectFileDir$ $Prompt$ slide

WebStorm的配置和使用

WebStorm的优势和常用快捷键 WebStorm相较其他的IDE优势; 1智能的代码补全 支持不同浏览器的提示,还包括所有用户自定义的函数(项目中),代码补全包含了所有流行的库,比如:JQuery, YUI, Dojo, Prototype, Mootools and Bindows。 2.代码格式化 代码不仅可以格式化,而且所有规则都可以自己来定义。 3.html提示 大家经常在js代码中编写html代码,一般来说十分痛苦,不过有了智能提示,就爽多了。而且html里面还能有js提示。 4.联想查询 只需要按着Ctrl键点击函数或者变量等,就能直接跳转到定义;可以全项目查找函数或者变量,还可以查找使用并高亮 5.代码重构 这个操作有些像Resharper,熟悉Resharper的用户应该上手很快,支持的有重命名、提取变量/函数、内联变量/函数、移动/复制、安全删除等等。 6.代码检查和快速修复 可以快速找到代码中的错误或者需要优化的地方,并给出修改意见,快速修复。代码调试 支持代码调试,界面和IDEA相似,非常方便。 7.代码结构浏览 可以快速找到代码中的错误或者需要优化的地方,并给出修改意见,快速修复。 8.代码折叠 功能虽小,不过胜在方便高效。 9.包裹或者去掉外围代码

自动提示包裹或者去掉外围代码,一键搞定。 配置和使用: 1.主题,把下载好的主题包放在C:\Users\jikey(用户 名)\.WebIde10\config\colors目录下,然后重启webstorm,settings –> colors & fonts –>scheme name中选择主题名。如果出现特别长代码对齐白线,在Editor –> Appearance –> Show vertical indent guides 前面的勾去掉即可。 2.添加VIM插件: File -> Settings -> Plugins -> Browse repositories -> 搜索vim,对它单击右键Download and install,然后重启IDE就可以了。 3.除了webstorm之外,此公司还提供另外一个针对phper的开发工具,phpStorm,主页上说明,phpstorm包括所有webstorm的功能。但是习惯于大括号去方法名在同一行显示,所以还得配置:File -> Settings -> code style -> PHP -> Wrapping and Braces -> Braces placement ->In method declaration : End of line. 4.zencoding默认的快捷键是Tab,如果你需要修改zencoding快捷键的话:File -> Setting -> Live Templates 。 5.在开发js时发现,需要ctrl + return 才能选提示候选项,又需要配置:File -> Setting -> Editor -> Code Completion -> Preselect the first suggestion:’Smart’ 改为 Always 6.注意的地方是:Webstorm的调试不支持中文路径中文文件名。 Webstorm的一些常用快捷键: 1. ctrl + shift + n: 打开工程中的文件,目的是打开当前工程下任意目录的文件。 2. ctrl + j: 输出模板 3. ctrl + b: 跳到变量申明处 4. ctrl + alt + T: 围绕包裹代码(包括zencoding的Wrap with Abbreviation) 5. ctrl + []: 匹配 {}[] 6. ctrl + F12: 可以显示当前文件的结构

Webstorm最常用快捷键

webstorm常用快捷键 查找/代替 快捷键说明 ctrl+shift+N通过文件名快速查找工程内的文件(必记) ctrl+shift+alt+N通过一个字符快速查找位置(必记) ctrl+F在文件内快速查找代码 F3查找下一个 shift+F3查找上一个 ctrl+R文件内代码替换 ctrl+shift+R指定目录内代码批量替换 ctrl+shift+F指定目录内代码批量查找 ctrl+R文件内代码替换 界面操作 快捷键说明 ctrl+shift+A快速查找并使用编辑器所有功能(必记) alt+[0-9]快速拆合功能界面模块 ctrl+shift+F12最大区域显示代码(会隐藏其他的功能界面模块)alt+shift+F将当前文件加入收藏夹 ctrl+alt+s打开配置窗口 ctrl+tab切换代码选项卡(还要进行此选择,效率差些)alt+<-或->切换代码选项卡 ctrl+shift+N通过文件名快速查找工程内的文件(必记) ctrl+shift+alt+N通过一个字符快速查找位置(必记) ctrl+F在文件内快速查找代码 F3查找下一个 shift+F3查找上一个 ctrl+R文件内代码替换 ctrl+shift+R指定目录内代码批量替换 ctrl+shift+F指定目录内代码批量查找 ctrl+R文件内代码替换 快捷键说明 ctrl+shift+A快速查找并使用编辑器所有功能(必记) alt+[0-9]快速拆合功能界面模块 ctrl+shift+F12最大区域显示代码(会隐藏其他的功能界面模块)alt+shift+F将当前文件加入收藏夹 ctrl+alt+s打开配置窗口 ctrl+tab切换代码选项卡(还要进行此选择,效率差些) alt+<-或->切换代码选项卡 ctrl+F4关闭当前代码选项卡

webstorm快捷键

webstorm的快捷键说明: Editing编辑相关快捷键 Ctrl + Space: Basic code completion (the name of any class, method or variable) 基本代码完成(任何类、函数或者变量名称),改为Alt+S Ctrl + Shift + Enter: Complete statement 补全当前语句 Ctrl + P: Parameter info (within method call arguments) 参数信息包括方法调用参数 Ctrl + mouse over code Brief Info 简单信息 Ctrl + F1 Show description of error or warning at caret 显示光标所在位置的错误信息或者警告信息 Alt + Insert Generate code…(Getters, Setters, Constructors)新建一个文件或者生成代码,…构造函数,可以创建类里面任何字段的getter与setter方法 Ctrl + O Override methods 重载方法 Ctrl + I Implement methods 实现方法 Ctrl + Alt + T Surround with…(if, else, try, catch, for, etc)用 * 来围绕选中的代码行,( * 包括 if 、 while 、 try catch 等) Ctrl + / Comment/uncomment with line comment 行注释/取消行注释 Ctrl + Shift + / Comment/uncomment with block comment 块注释/取消块注释 Ctrl + W Select successively increasing code blocks 选择代码块,一般是增量选择Ctrl + Shift + W Decrease current selection to previous state 上个快捷键的回退,减量选择代码 Alt + Q Context info 上下文信息 Alt + Enter Show intention actions and quick-fixes 意图行动,快速见效 Ctrl + Alt + L Reformat code 根据模板格式对代码格式化 Tab/ Shift + Tab Indent/unindent selected lines 对所选行进行缩排处理/撤销缩排处理

Webstorm常用插件和快捷键

Web前端开发神器——Webstorm不用多介绍,强大的智能提示只是它的一个功能特性,它还具有许多有用的特性,比如版本控制、本地历史、即时模板等。Webstorm还内置了对SASS、NodeJS、CoffeeScript、Jade 的支持,并且可自定义代码格式化规则。 Plugins(插件) Markdown 支持md,点击下面的Text/Previev可以切换代码/预览视图 AngularJS 支持AngularJS的标签提示

AceJump 快速定位光标位置,有了它你可以丢弃鼠标了 最重要的插件: Webstorm APICloud Plugins

WebStorm扩展插件,包括:应用管理、应用框架、页面模板、代码提示、代码管理、Widget打包、真机同步、日志输出、管理自定义AppLoader等功能,其他的功能插件也在不断增加;所有插件都已开源,开发者可以下载这些插件在自己的WebStorm中安装后使用,开发者也可以在此基础上按需求扩展自己的插件。 常用快捷键 Tab: 生成代码

alt + [0-9]: 快速拆合功能界面模块 alt + <-或->: 切换代码选项卡 alt + F1: 查找代码在其他界面模块的位置,颇为有用 alt + Insert: 新建一个文件或其他 alt + shift + F: 将当前文件加入收藏夹 alt + up/down: 上一个/下一个方法 ctrl + / 或ctrl + shift + /: 注释(// 或者/*…*/ ) ctrl + ]/[: 光标到代码块的前面或后面 ctrl + <-或->: 以单词作为边界跳光标位置 ctrl + Alt + B: Go to implementation(s) 跳转方法实现处 ctrl + alt + enter: 在当前行前面新建行 ctrl + alt + L: 格式化代码 ctrl + alt + s: 打开配置窗口 ctrl + alt + shift + c: 拷贝相关数据包括路径和所在行 ctrl + Alt + T: with…(if, else, try, catch, for, etc)用* 来围绕选中的代码行,(* 包括if 、while 、try catch 等) ctrl + B: 快速打开光标处的类或方法 ctrl + Backspace: Delete to word start 删除文字开始 ctrl + B或ctrl + 鼠标左键单击: 快速打开光标处的类或方法,(NB的功能)ctrl + C: 提交代码 ctrl + D: 复制当前行 ctrl + Delete: Delete to word end 删除文字结束 ctrl + E: 最近打开的文件 ctrl + F: 在文件内快速查找代码 ctrl + F4: 关闭当前代码选项卡 ctrl + G: 到指定行的代码 ctrl + p: 向远程版本库推送更新 ctrl + R: 文件内代码替换 ctrl + shift + A: 快速查找并使用编辑器所有功能(必记) ctrl + shift + alt + N: 通过一个字符快速查找位置(必记) ctrl + shift + c: 拷贝文件路径 ctrl + shift + enter: 新建行 ctrl + shift + F: 指定目录内代码批量查找 ctrl + shift + F12: 最大区域显示代码(会隐藏其他的功能界面模块) ctrl + shift + F7、ALT + F3: 高亮显示所有该文本(选中文本),按Esc高亮消失。ctrl + shift + I: Open quick definition lookup 打开定义快速查找

《Web前端设计从入门到实战》教学大纲-仅供参考

《Web前端设计基础》教学大纲 适用专业:计算机科学与技术、软件工程、物联网 课程类别:非学位课,专业基础课 课程学时:51学时(周2+1学时) 课程编号:9051404 课程学分:3学分 一、课程性质 《Web前端设计基础》课程是计算机科学与技术、软件工程、物联网工程专业的一门专业基础课程,以Web基本概念和Web标准为基准点、通过对Web前端主流开发技术的学习和研究,让学生理解和掌握HTML5、CSS3以及JavaScript脚本语言的相关知识,通过这门课程的教学,不仅使学生通过项目实践培养学生开发和设计Web站点的基本技能,更要使学生充分了解Web思想,为进一步学习后续课程打下良好的基础。 二、课程教学目标与基本要求 本课程的教学目标是让学生理解HTML5、CSS3以及JavaScript脚本语言的基本语法,掌握常用的Web页面布局技术,理解并熟练应用JavaScript常用对象的属性方法,使用DOM技术编写页面的客户端程序,通过项目实训,培养学生具备设计实现Web客户端页面的初步能力。 本课程教学基本要求是让学生理解Web设计的基本原则、栏目和网站目录结构定义、标准页面布局方法、导航菜单制作、图文排版、页面交互等方面的基础知识;能够熟练运用HTML5中的文字、链接、列表、表格、表单、图像、多媒体等标记语言设计制作网页;熟练掌握CSS3对网页进行布局和修饰的基本方法;掌握JavaScript脚本语言的基本语法,理解对象的概念及使用JavaScript来编写客户端脚本程序。 三、课程内容 其中标记★为难点 第1章 Web技术概述 1.1 Internet概述 1.1.1 理解TCP/IP 1.1.2 理解主机和IP地址 1.1.3 理解域名和DNS 1.2 Web概述 1.2.1 了解Web历史 1.2.2 ★掌握Web体系结构 1.2.3 理解基本Web技术 1.2.4 了解Web服务器 1.3 超文本与标记语言 1.3.1 掌握超文本与超媒体 1.3.2 掌握标记语言 1.4 Web标准 1.4.1 掌握Web标准体系 1.4.2 了解采用Web标准的优势

相关主题
文本预览