这篇文章跟大家分析一下“jquery怎么点击按钮去掉一行样式”。内容详细易懂,对“jquery怎么点击按钮去掉一行样式”感兴趣的朋友可以跟着小编的思路慢慢深入来阅读一下,希望阅读后能够对大家有所帮助。下面跟着小编一起深入学习“jquery怎么点击按钮去掉一行样式”的知识吧。
方法:1、利用“.class”选择器给指定的一行元素设置样式;2、给按钮绑定点击事件并指定处理函数;3、在函数中利用removeClass()方法去除指定行元素的类即可去除一行样式,语法为“元素对象.removeClass("指定类")”。
本教程操作环境:windows10系统、jquery3.2.1版本、Dell G3电脑。
jquery怎样点击按钮去掉一行样式
可以利用.class选择器给指定的元素设置样式。
这样就可以一次性去除元素的样式,使用css方法也能够去除样式,但是不能直接全部去除,因此使用了removeClass方法。
removeClass() 方法从被选元素移除一个或多个类。
示例如下:
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").removeClass("intro");
});
});
</script>
<style type="text/css">
.intro{
font-size:120%;
color:red;
}
</style>
</head>
<body>
<h2>这是一个</h2>
<p class="intro">这是一行段落。</p>
<p >这是另一行段落。</p>
<button>移除指定一行的样式</button>
</body>
</html>
输出结果:
点击按钮后:
关于jquery怎么点击按钮去掉一行样式就分享到这里啦,希望上述内容能够让大家有所提升。如果想要学习更多知识,请大家多多留意小编的更新。谢谢大家关注一下编程网网站!