亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何在 JavaScript 中創建一個將文本增加 1px 的按鈕

如何在 JavaScript 中創建一個將文本增加 1px 的按鈕

撒科打諢 2023-07-20 15:05:16
我需要你的幫助。我是 JavaScript 初學者,我想創建一個將文本增加 1px 的按鈕。你能幫助我嗎?
查看完整描述

3 回答

?
交互式愛情

TA貢獻1712條經驗 獲得超3個贊

這應該有幫助!window.getComputedStyle(txt, null).getPropertyValue('font-size');您可以使用它來獲取fontSize元素的 。


const txt = document.querySelector("#txt");


function changeFontSize(){

  let fontSize = window.getComputedStyle(txt, null).getPropertyValue('font-size');

  let newFontSize = Number(fontSize.slice(0,2)) + 1

  txt.style.fontSize = `${newFontSize}px`;

 }

#txt {

  font-size: 16px;

 }

<div id="txt">Sample Text</div>

<button onclick="changeFontSize()">Click</button>


查看完整回答
反對 回復 2023-07-20
?
守著一只汪

TA貢獻1872條經驗 獲得超4個贊

有很多方法可以做到這一點,如上面的 Som 重放


我的方式


<body>

    <p class="text" style="color:red">Hello Ahmed</p>

    <button class="btn">Click Me</button>


    <script>

         x = 1;

    document.querySelector(".btn").addEventListener("click",function(){

        increseText();

    })


    function increseText(){

        x++; 

        document.querySelector(".text").style.fontSize = x+'px';

        console.log(x)

    }

    </script>

</body>


查看完整回答
反對 回復 2023-07-20
?
嗶嗶one

TA貢獻1854條經驗 獲得超8個贊

嘗試這個 :


<!DOCTYPE html>

<html>


<head>

    <title>Page Title</title>

</head>


<body>


    <h1 id='h'>My First Heading</h1>

    <p id='p'>My first paragraph.</p>

    <button type='button' id='btn'>increases by 1px</button>

    <script>

        document.getElementById("btn").addEventListener("click", function () {

            var el = document.getElementById('h');

            var style = window.getComputedStyle(el, null).getPropertyValue('font-size');

            var fontSize = parseFloat(style);

            el.style.fontSize = (fontSize + 1) + 'px';

        })

    </script>

</body>


</html>


查看完整回答
反對 回復 2023-07-20
  • 3 回答
  • 0 關注
  • 175 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號