Backbone.jsのModelクラス②

Backbone.js

前回の記事に引き続き、今回もModelクラスです。

今回はescape関数です。
前回使ったget関数とほぼ同じですが、HTMLタグをエスケープしてくれます。

まずはソースコードから。

<html>
<head>
<script type="text/javascript" src="../js/jquery-1.10.1.js"></script>
<script type="text/javascript" src="../js/underscore.js"></script>
<script type="text/javascript" src="../js/backbone.js"></script>
<script type="text/javascript">
var Player = Backbone.Model.extend({
});

$(document).ready(function() {
	player = new Player({
		name : "<b>田中一郎</b>"
	});
	
	$("#contents").html(player.get("name"));           // -①
	$("#contents2").html(player.escape("name"));   // -②
});
</script>
</head>
<body>
<div id="contents">
</div>
<div id="contents2">
</div>
</body>
</html>

順番に説明していきます。

①get使用時

今回は対象文字列が「田中一郎」をタグで囲んだ文字列です。
ブラウザで表示するとタグがそのまま適用され、「田中一郎」が太字になって表示されます。

②escape使用時

一方でescape関数はHTMLタグに対してエスケープを行います。
ブラウザで表示すると、タグはエスケープされて、「田中一郎」と表示されます。