覚えれば一生もの！ ウェブエンジニアのための正規表現活用入門 - ICS MEDIA
正規表現は文字列の検索や置換を行うための強力で便利なツールです。基本をマスターすれば開発から日常の事務作業までさまざまな場面でラクをできる魔法の道具ですが、見た目がちょっと分かりづらいので、避けている方もいるのではないでしょうか？ 筆者の個人的観測ですが、とりわけフロントエンドのエンジニアには正規表現に苦手意識を感じている方が多いようです。 この記事では正規表現の基本と、正規表現がどこで使えてどれだけ便利になるのかを紹介します。 正規表現の基本：正規表現ってそもそも何？ 正規表現（regular expression）は、ごく簡単にいえば「さまざまな文字列のバリエーションをひとつの文字列で表現したもの」です。たとえば、郵便番号の7桁の数字には（実際に使われていないものも含めれば）一千万通りのバリエーションがありますが、正規表現を使えば次のようにひとつの文字列で表現できます。 ▼「7桁の数字
CSSを活用してHTMLのセマンティックエラーを指摘する方法 - ICS MEDIA
CSSはWebページの見た目を整えるものですが、ちょっと違う使い方もできます。たとえば、予期せぬ横スクロールが発生した時、以下のようにすることで全ての要素のアウトラインが表示され、不用意にはみ出している部分が視覚的に分かりやすくなります。 * { outline: 2px solid red; } これを応用してタグの不適切な利用部分をハイライトできます。 このような不適切なタグ利用を検知して警告する「デバッグCSS」を作ってみました。このようなCSSをLintのようにする使い方は#lintHTMLwithCSSのハッシュタグで海外でも考案されています。仕様上許可されないものは赤色で点滅、ダメではないが、やらない方がベターなものは黄色で点滅するようになっています。 当記事では下記のデモを見ながらだと理解を深めやすいので、合わせて読むことをオススメします。 サンプルを別ウィンドウで開く コー
VueのComponentにObjectを渡したいのに属性値だよ消えるよって怒られる - Qiita
webpackerを使ってVueJSを書いている中で、 componentへObjectを継承したい場面でぶつかった壁の話。 なんも考えずにやると、 // parent.vue <template> <child hoge="hoge"> </template> <script> import Child from 'child' export default { components: { 'child': Child }, data () { return { hoge: { name: 'hoge', age: 30 } } } } </script> // child.vue <template> <p v-text="hoge.name"></p> </template> <script> export default { props: ['hoge'] } </script>
Google+ ウィジェットの JavaScript コードに async / defer 属性がついた件
Google+ プラットフォームで配布されている、「+1 ボタン」 や、「バッジ」 などの JavaScript コードすべてに、async / defer 属性が付与されるようになりました。 Google+ プラットフォームで配布されている、「+1 ボタン」 や、「バッジ」 などを Web サイトに設置する際に使用される JavaScript のソースコードがありますが、これらソースコードに、script 要素の async / defer 属性が付与されるようになりました。 Googleの Ilya Grigorik 氏が自身の Google+ に投稿しているほか、実際のソースコードにもすでに反映されています。 All Google+ widgets have been updated to use the script[async + defer] pattern!... ： Ily
Firefox の srcset 属性実装は sizes 属性を省略すると正常に動作しないらしい
1つ前の記事で picture 要素 や srcset 属性に関して書いた課程で知ったんですが、Firefox （テストしたのは Firefox Nightly 34.0a1） の srcset 属性実装に関して、sizes 属性を省略したときに正しく動作しない問題があるようです。Bugzilla@Mozilla に報告されていました。 1052417 - Default `sizes` attribute value for `srcset` should be 100vw ： Bugzilla@Mozilla srcset 属性の実装状況 srcset 属性は、近々正式リリースされる、Firefox 32 で試験的に実装されていますが、今回テストしたのは Firefox Nightly （34.0a1） です。まだ試験的な実装のため、dom.image.srcset.enabled お
WordPressの固定ページにフォームを設置する際の落とし穴 - リスティング広告運用代行｜カルテットコミュニケーションズ
WordPressで作成したブログやサイトに自分で設置したメールフォームで、フォームを送信しようとすると何故か404エラーになったという経験はありませんか？ よくあるケース この現象、多くの場合原因はフォーム項目のname属性に”name”という名前を使っていることです。 例えば、下記は一般的な問い合わせフォームの「お名前」入力欄です。 [html] <th>お名前</th> <td><input type=”text” name=”name” value=”” /></td> [/html] このフォームのsubmitボタンをクリックすると、おそらく404エラーになるでしょう。 この場合、name=”full_name” などのように、変数名を変えてあげれば問題なく動作するようになります。 原因 どうやらこの現象は、WordPressのフレームワークで予約されているパラメータ変数名を使っ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript - htmlの属性の一部に変数をいれる方法｜teratail
.JS web coding memolist
