为了账号安全,请及时绑定邮箱和手机立即绑定

点击按钮没反应

<title>javascript练习</title>

<script src="script3.js"></script>

</head>

<body>

<p id="p1" class="one">

日积月累,终入化境

</p>

<input type="button" onclick="add()" value="添加样式" />


<p id="p2" class="two">

很多人努力的程度,根本达不到拼天赋的程度

</p>

<input type="button" onclick="modify()" value="更改样式" />


</body>

</html>


javascript文件代码

.one{

border:5px solid black;

width:300px;

height:60px;

background:#722ed0;

color:#dcdbdf;

}

.two{

borer:10px solid #d4d2c8;

width:500px;

height:100px;

background:#30302d;

color:#47319f;

}


function add(){

var p1=document.getElementById("p1");

p1.className="one";

}

function modify(){

var p2=document.getElementById("p2");

p2.className="two";

}


正在回答

2 回答

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>className属性</title>

<style>

    body{ font-size:16px;}

    .one{

border:1px solid #eee;

width:230px;

height:50px;

background:#ccc;

color:red;

    }

.two{

border:1px solid #ccc;

width:230px;

height:50px;

background:#9CF;

color:blue;

}

</style>

<!--style包裹的是CSS样式-->

</head>

<body>

    <p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>

    <input type="button" value="添加样式" onclick="add()"/>

<p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>

    <input type="button" value="更改外观" onclick="modify()"/>


<script type="text/javascript">

  function add(){

     var p1 = document.getElementById("p1");

     p1.className="one";

  }

  function modify(){

     var p2 = document.getElementById("p2");

     p2.className="two";

  }

</script>

<!--script包裹的是js代码-->

</body>

</html>


0 回复 有任何疑惑可以回复我~

CSS代码不要放进JS里面啊,要么直接放在HTML界面,要么自己建一个css

0 回复 有任何疑惑可以回复我~
#1

慕村9049647 提问者

谢谢!
2017-08-10 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
JavaScript入门篇
  • 参与学习       739721    人
  • 解答问题       9566    个

JavaScript做为一名Web工程师的必备技术,本教程让您快速入门

进入课程

点击按钮没反应

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信