MyCode

HTMLタグエスケープ

概要

HTML中で「<」などの文字を使うと、タグとして認識されて文字列として表示することが出来なくなります。

それを防ぐためにエスケープ処理を行うためのツールです。
※例えば「<」は「&lt;」に置き換えると文字列として表示されます。
このツールでは「&」「<」「>」に対応しています。

コード

HTML

<textarea id="input" placeholder="入力欄"></textarea>
<p class="txt_cen">↓</p>
<textarea id="output" placeholder="出力欄"></textarea>
<div class="txt_cen">
    <button onclick="htmlesc();">変換</button>
    <button id="bt_copy" data-clipboard-target="#output">出力結果をコピー</button>
</div> 
<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.3/clipboard.min.js"></script>

JavaScript

function htmlesc(){
    var inputOb = document.getElementById("input");
    var outputOb = document.getElementById("output");
    var output = inputOb.value
    .replace(/&/g,'&amp;')
    .replace(/</g,'&lt;')
    .replace(/>/g,'&gt;');
    outputOb.value = output;
}

最近の投稿

計数器

シンプルな計数器です。各桁の間の色を変えたかった…

HTMLタグエスケープ

HTML中で「<」などの文字を使うと、タグとして認…

ギャラリー

クリック(もしくはタップ)した画像をモーダルウィン…

検索フォーム

そのまま。様々な検索フォームです。ボタン画像はICO…

楽天市場検索順位チェッカー

楽天市場内での検索結果における指定ショップの順位…

mMenu

JavaScriptを使用せずにCSSのみで作られたレスポンシ…