js控制文章内容字体大小

最新推荐文章于 2024-01-02 14:04:58 发布

cathy18c

最新推荐文章于 2024-01-02 14:04:58 发布

阅读量631

点赞数

分类专栏：碰到的问题

本文链接：https://blog.csdn.net/cathy18c/article/details/102930318

版权

碰到的问题专栏收录该内容

7 篇文章 0 订阅

订阅专栏

比如我们把文章内容放在<div id=“neirong” class="entry">里面，想要通过点大中小来展示内容区文字大小，这时候如果仅仅使用document.getElementById(“neirong”).style.fontSize=“30px” 可能无法达到想要的效果
因为如果我们的内容是来自于后台编辑器，那么代码肯定不是很干净的，会有很多p，span而且这些p，span都有自己的行内样式，从优先级上来看，行内样式优先，所以这么写控制字体大小的代码是不对的，那么怎么解决：

 <script language="javascript"> 
        function setfont(size) {
            document.getElementById("artcon").style.fontSize = size;
            var ps = document
                .getElementById("artcon")
                .getElementsByTagName("span");
            for (var i = 0; i < ps.length; i++) {
                ps[i].style.fontSize = size;
            }
        }
</script>

字体: &nbsp;<a href="#" onclick="javascript:setfont('12px')">小</a>&nbsp;&nbsp;<a href="#" onclick="javascript:setfont 
            ('18px');">中</a>&nbsp;&nbsp;<a href="#" οnclick="javascript:setfont('24px');">大</a>
            
<div class="detail_con " id="artcon"><%=con_content %></div>