下面是源代码,运行时,点击段落文字,系统会判断如果当前包含了red这个class,则将其删除,如果没有包含red,则添加一个red的class。

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta charset="gb2312" />

<title>hello world</title>

<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js "></script>

<script type="text/javascript">

$(document).ready(function(){

    $("#p1").on('click',function(){

        if($("#p1").hasClass('red')){

            $('#p1').removeClass('red');

        }else{

            $('#p1').addClass('red');

        }

    });

});

</script>

<style>

.red{ color:red; }

</style>

</head>

<body>

<div id="p1" class="blue red">点击这一段内容试试</div>

03-15 03:28