页面有5个p段落,点击每个p段落的时候打印p段落内容和设置背景色红色,使用css函数和html函数
时间: 2024-02-22 15:55:11 浏览: 67
制作一个详细的网页设计包括HTML、CSS和JavaScript.docx
好的,为您提供代码如下:
HTML代码:
```
<p onclick="changeColor(this)">第一个p段落</p>
<p onclick="changeColor(this)">第二个p段落</p>
<p onclick="changeColor(this)">第三个p段落</p>
<p onclick="changeColor(this)">第四个p段落</p>
<p onclick="changeColor(this)">第五个p段落</p>
```
JavaScript代码:
```
function changeColor(element) {
var content = element.innerHTML; // 获取p段落内容
console.log(content); // 控制台输出p段落内容
element.style.backgroundColor = "red"; // 设置背景色为红色
}
```
当您点击每个p段落时,将会在控制台输出该段落的内容,并将背景色设置为红色。
阅读全文