属性操作例子-页面文字放大缩小

点击加号按钮，文字字号会增大；点击减号按钮，文字字号会减小；

html:

<input type="button" value="+" id="Jia"> <input type="button" value="-" id="Jian"> <p id="oP">我是一段文字，我是一段文字...</p>

css：

<style> #oP { font-size: 15px; } </style>

js：

<script> window.onload = function(){ var jia = document.getElementById('Jia'); var jian = document.getElementById('Jian'); var oP = document.getElementById('oP'); var num = 15;//原字号是15像素，在15的基础上进行增加减少 jia.onclick = function(){ num ++; //alert(num);查看弹出的内容 oP.style.fontSize = num + 'px'; } jian.onclick = function(){ num --; oP.style.fontSize = num + 'px'; } } </script>

注意： 1. JS中不允许出现中划线’-‘例如：font-size要写成fontSize格式。 2. num只是数字，并没有‘像素’单位，所以要添加单位，否则不会改变字体大小。