Обичам да добавям стойност, когато въвеждам дзен кодиране. Например input:text става :. Как да направя така, че input:text да стане и да поставя курсора на клавиатурата между '' на свойството стойност?
Как да добавите стойност с дзен кодирането?
Отговори (6)
@Луна
Ето един трик, който използвам.
select>option#$*5 // this would give the following HTML <select>
<select>
<option id="1"></option>
<option id="2"></option>
<option id="3"></option>
<option id="4"></option>
<option id="5"></option>
</select>
след това избирате целия блок <select>
във вашия текстов редактор.
След това заменете всички "<option id"
с "<option value"
.
Наздраве :-)
Ако посочите стойността, като дефинирате каква стойност трябва да бъде обвита (между отварящи и затварящи тагове), тогава използвайте следния модел
b{this is a bold text}
което води до
<b>this is a bold text</b>
Въпреки че не знам редакторите и IDE да поддържат тази функция, но всичко, което мога да кажа е, че работи за IntelliJ и Notepad++.
Добавяне на това table>tr*5>td*5>lorem10
Ще генерира:
<table>
<tr>
<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quia, aperiam.</td>
<td>Sit eius temporibus optio reprehenderit itaque blanditiis harum consectetur rerum.</td>
<td>Ex, odit, nostrum quia nemo consequuntur quisquam corrupti ipsam quis.</td>
<td>Voluptatibus, cum, aspernatur rem officia recusandae similique saepe praesentium nulla.</td>
<td>Labore, obcaecati iure rerum beatae dignissimos fugit sapiente! Sequi, fugit.</td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa, totam.</td>
<td>Officiis, dolores facilis non vitae eius accusamus consequatur magnam incidunt!</td>
<td>Voluptates repellendus delectus illo facilis at provident unde sint error!</td>
<td>Quibusdam, nisi, reprehenderit incidunt rem a ducimus sint expedita molestias?</td>
<td>Quam, laborum rerum unde quaerat fuga architecto odio voluptatum nemo.</td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. In, architecto.</td>
<td>Maiores, voluptatum modi sunt iure aperiam aut quisquam nobis suscipit?</td>
<td>Repellendus, amet vero modi inventore ipsam libero culpa animi debitis.</td>
<td>Earum consequuntur ut totam possimus provident libero ad commodi esse!</td>
<td>Reprehenderit, quo, et laboriosam inventore error quas facilis dignissimos voluptate.</td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maxime, necessitatibus.</td>
<td>Officiis maxime praesentium repellendus distinctio cum atque aspernatur animi dolorum.</td>
<td>Culpa pariatur quos quis voluptate ratione eos unde accusantium quisquam.</td>
<td>Id possimus nisi sequi nostrum cum pariatur eius vel commodi.</td>
<td>Velit, et, iure incidunt illum culpa cum nihil quidem perferendis.</td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est, ab?</td>
<td>Labore, voluptatem quasi temporibus fugit cumque possimus obcaecati id dolor?</td>
<td>Asperiores hic maiores architecto alias commodi ea in suscipit unde!</td>
<td>Distinctio, quasi reprehenderit tempora ipsa nisi ad ut eaque numquam!</td>
<td>Nobis, illum ex excepturi quaerat mollitia animi vero repellat quam.</td>
</tr>
</table>
Доколкото знам, не можете - поне не и в стандарта за дзен кодиране по подразбиране. Все пак има поне един проект, който се опитва да добави стойности и някаква елементарна логика (като зацикляне) към Zen Coding, вижте https://github.com/zodoz/jquery-ZenCoding. Това е изпълнение на Javascript, имайте предвид.
Можете да добавяте атрибути към тагове с помощта на квадратни скоби, така че писането на input:text[value]
ще създаде <input type="text" name="|" id="|" value="|">
— вход с три места за контейнери, две общи, които идват с :text
и атрибут value
, който идва от [value]
.
Нещо, което използвах веднъж..
select>option[value=$].gameSize${$x$}*10
ще генерира
<select name="" id="">
<option value="1" class="gameSize1">1x1</option>
<option value="2" class="gameSize2">2x2</option>
<option value="3" class="gameSize3">3x3</option>
<option value="4" class="gameSize4">4x4</option>
<option value="5" class="gameSize5">5x5</option>
<option value="6" class="gameSize6">6x6</option>
<option value="7" class="gameSize7">7x7</option>
<option value="8" class="gameSize8">8x8</option>
<option value="9" class="gameSize9">9x9</option>
<option value="10" class="gameSize10">10x10</option>
</select>
И така, $
ще се разшири до съответното число... където и да го поставите!
Използвах плъгина Emmet с Sublime Text 2.