首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

怎么将js的值传到字体大小的设置中

2013-02-05 
如何将js的值传到字体大小的设置中scriptvar dd12/scriptstyle.hh {font_size:? px}/style请问

如何将js的值传到字体大小的设置中
<script>
var dd=12;
</script>

<style>
.hh {font_size:? px;}

</style>

请问如何将dd的值传到font-size中?多谢
[解决办法]
使用jquery的话
$(".hh").css("font_size", dd+"px");
[解决办法]
1. 使用jquery的话是这样:


$(".hh").css("fontSize", dd + "px");

2. 使用js的话是这样:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
    <title>test</title>
    <style type="text/css">
        *{ margin:0; padding:0;}
        body{font:12px/1.5 arial;background:#fff;}
    </style>
    <script type="text/javascript" src="../jquery-1.8.3.min.js"></script>
</head>
<body>
<div class="hh">adlkd</div>
<div id="font1">豪情壮志不言愁!</div>
<input type="text" name="" id="text01"><button id="btn0">设置大小</button> <br>
<button>12号字大小</button>
<button>14号字大小</button>
<button>16号字大小</button>
<script type="text/javascript">
    function id(obj){
        return document.getElementById(obj);
    }
    var text01 = id('text01'),
        btnSet = id('btn0'),
        font1 = id('font1');

    btnSet.onclick = function(){
       font1.style.fontSize = text01.value + 'px';
    }
    var arr = [0, 12, 14, 16],
        btn = document.getElementsByTagName('button');
    for(var i = 1; i < btn.length; i++){
        btn[i].idx = i;
        btn[i].onclick = function(){
            font1.style.fontSize = arr[this.idx] + 'px';
            console.log(i);
        }
    }
</script>
</body>
</html>

[解决办法]
楼上正解。用js设置标签的样式。
如果没用库,那可以先用document.getElementByID()或其他方法获取指定的标签,然后设置他的style。
style.fontSize=xxx
[解决办法]

<style type="text/css">
#div1{ font-size:12px;}
 </style>
<script src="http://code.jquery.com/jquery-latest.js"></script>


<script type="text/javascript"> 
// 字体大小是font-size,非font_size
$(function(){
$("#abv").click(function(){
var dd=22;
$("#div1").css("font-size",dd+"px");
});
})
</script>   
<input type="button" id="abv" value="测试用按钮"/>
<div id="div1">
点击按钮后字体大小将改变
</div>

热点排行