首页 > 技术文章 > js部分功能

csdwly 2019-10-24 16:22 原文

js部分功能:

1、  js能够改变html内容

eg:  <h2>js能做什么</h2>

    <p id="demo">原内容</p>

    <button id="btn">按钮</button>

    <script>

        window.onload=function(){

            var obtn=document.getElementById("btn");

            obtn.onclick=function(){

                document.getElementById("demo").innerHTML="新内容";

            }

        }

    </script>

  

2、  js能够改变html样式css

eg:<h2>js能做什么</h2>

    <p id="demo">原样式</p>

    <button id="btn">按钮</button>

    <script>

        window.onload=function(){

            var obtn=document.getElementById("btn");

            obtn.onclick=function(){

                document.getElementById("demo").style.fontSize='35px';

            }

        }

    </script>

   

 

3、  js能够隐藏/显示html元素

eg:    <h2>js能做什么</h2>

    <p id="demo" style="display:none;">我会隐藏或显示</p>

    <button id="btn">按钮</button>

    <script>

        window.onload=function(){

            var obtn=document.getElementById("btn");

            obtn.onclick=function(){

                if(document.getElementById('demo').style.display=="block"){

                    document.getElementById("demo").style.display='none';

                }else{

                    document.getElementById("demo").style.display='block';

                }

               

            }

        }

    </script>

 

推荐阅读