这个代码要怎么理解?

来源:3-6 控制类名(className 属性)

卡兰尼克

2016-10-15 07:54

<!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>

</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>

</body>

</html>



document.getEementById获取的不是id名吗

classname不是更改的是类的名字的吗

为什么id的内容也可以当做class的内容去更改啊,这个代码要怎么理解啊- -



然后,,,,,我真的不是很明白什么时候需要变量声明什么时候又要用函数 。觉得这个内容学的好晕啊- - - - - -


写回答 关注

2回答

  • 夜下的影
    2016-10-15 09:46:17

    首先用document.getEementById获取这个元素,className表示元素的类名,用className可以添加或改变一个类名,也就是说通过添加或改变类名在添加或改变样式,

  • 慕粉4196364
    2016-10-15 09:41:20

    oncilck="add()"是点击按钮会调用add函数,add函数的内容就是通过id将id为"p1"的标签复制给p1变量,p1变量调用className方法将此变量的类修改为one,上面css代码定义了one类的样式。two也一样

JavaScript入门篇

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

739816 学习 · 9566 问题

查看课程

相似问题