HBuilder快速生成代码行的技巧

简介: HBuilder快速生成代码行的技巧
1.在body内输入div.box按下tab键

效果:

<div class="box"></div>
2.在body内输入div#box按下tab键

效果:

<div id="box"></div>
3.在body内输入ul>li{旺财}*3按下tab键

效果:

<ul>
    <li>旺财</li> 
    <li>旺财</li>
    <li>旺财</li>
 </ul>        
4.在body内输入div>a[href='#']{小强}*3按下tab键

效果:

<div>
      <a href="#">小强</a>
      <a href="#">小强</a>
      <a href="#">小强</a>
</div>
5.在body内输入table>tr*3>td{$}*5按下tab键

效果:

<table>
  <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
        <td>5</td>
    </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
</table>
6.在body内输入select>option{$}*5按下tab键

效果:

<select name="" id="">
     <option value="">1</option>
     <option value="">2</option>
     <option value="">3</option>
     <option value="">4</option>
     <option value="">5</option>
</select>   
7.在body内输入select>option[value=‘序号’]{$}*5>a[href=’#’]{编号}按下tab键

效果:

<select name="" id="">
      <option value="序号">1<a href="#">编号</a></option>
      <option value="序号">2<a href="#">编号</a></option>
      <option value="序号">3<a href="#">编号</a></option>
      <option value="序号">4<a href="#">编号</a></option>
      <option value="序号">5<a href="#">编号</a></option>
</select>      

属性值用[ ]填充,文本内容用{ }填充,*数字:代表生成的元素个数

目录
相关文章
|
小程序 开发者
HBuilderX运行uniapp到微信开发者工具常见报错
HBuilderX运行uniapp到微信开发者工具常见报错
1100 0
|
XML 人工智能 JSON
autojs之vscode必装插件
Color Highlight Highlight web colors in your editor
1924 0
autojs之vscode必装插件
|
JSON JavaScript 小程序
关于HBuilderX的简单介绍
关于HBuilderX的简单介绍
3622 0
|
2月前
|
前端开发 JavaScript IDE
WebStorm 打开多个项目的方法
【8月更文挑战第2天】
|
4月前
|
JavaScript 前端开发 C++
vscode编辑器中如何调试nextjs代码
代码可调式的重要性不言而喻。 对于Programer来说,自己编写的程序能够被优雅调试是一件幸福的事情,特别是习惯了后端程序调试的开发者... 在折腾Nextjs项目的日子里,我走了很多弯路才弄明白在vs code中如何优雅的调试代码。
164 1
vscode编辑器中如何调试nextjs代码
|
11月前
|
JavaScript 小程序 开发工具
WebStorm中如何设置wepy文件代码高亮
WebStorm中如何设置wepy文件代码高亮
102 0
|
小程序 IDE 安全
UniAPP HBuilderX 运行到各个小程序开发工具
UniAPP HBuilderX 运行到各个小程序开发工具
476 0
|
移动开发 编译器
HBuilderX下载安装以及打包uniapp项目
公司需要打包uniapp的项目为h5,自己之前没接触过,兴趣来了,根据百度搜索需要HBuilderX工具进行打包。
Hbuilder x学习1-Hbuilder x下载
Hbuilder x学习1-Hbuilder x下载
64 0
Hbuilder x学习1-Hbuilder x下载
|
前端开发 JavaScript IDE
HBuilderX|前端编辑器
HBuilderX|前端编辑器
582 0