文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

jQuery中怎么设置特殊属性

2024-04-02 19:55

关注

本篇文章给大家分享的是有关jQuery中怎么设置特殊属性,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。

jQuery的属性

使用attr()方法读取或设置元素的属性,对于jQuery没有封装的属性(所有浏览器没有差异的属性)用attr进行操作

使用removeAttr删除属性。删除的属性在源代码中看不到,这是和清空属性的区别。attr('name','')

示例:操作属性

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>jQuery测试</title>
    <style type="text/css">
        .cls{
            background-color: fuchsia;
        }
    </style>
    <script type="text/javascript" src="js/jquery-1.12.3.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#btnAdd').click(function(){
                $('#dv').attr('class','cls');
            });
            $('#btnClear').click(function(){
                $('#dv').attr('class','');//属性还有,值没了
            });
            $('#btnRemove').click(function(){
                $('#dv').removeAttr('class');//属性没有了。有属性就要占用内存。
            });
        });
    </script>
</head>
<body>
    <input type="button" id="btnAdd" value="添加样式"/>
    <input type="button" id="btnClear" value="清空样式"/>
    <input type="button" id="btnRemove" value="移除样式"/>
    <div id="dv" ></div>
</body>
</html>

效果图

jQuery中怎么设置特殊属性

示例:全选不选反选

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>jQuery测试</title>
    <style type="text/css">
        .cls{
            background-color: fuchsia;
        }
    </style>
    <script type="text/javascript" src="js/jquery-1.12.3.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#btnAll').click(function(){
                $(':checkbox').prop("checked",true);
            });
            $('#btnNone').click(function(){
                $(':checkbox').prop("checked",false);
            });
            $('#btnReverse').click(function(){
                $(':checkbox').each(function (k,v) {
                    $(v).prop("checked",!$(v).is(":checked"));
                });
            });
        });
    </script>
</head>
<body>
    <input type="button" id="btnAll" value="全选"/>
    <input type="button" id="btnNone" value="不选"/>
    <input type="button" id="btnReverse" value="反选"/>
    <input id="ch_swimming" type="checkbox"/><label for="ch_swimming">游泳</label>
    <input id="ch_basketball" type="checkbox"/><label for="ch_swimming">篮球</label>
    <input id="ch_football" type="checkbox"/><label for="ch_swimming">足球</label>
</body>
</html>

效果图

jQuery中怎么设置特殊属性

RadioButton操作

取得RadioButton的选中值,被选中的radio只有一个值,所以直接用val()

显示单选按钮中哪些内容被选中了,注意多个单选按钮不在同一组中

设置RadioButton的选中值

.attr('checked',true);

$('input[name=gender]').val(["女"]); 或 $(':radio[name=gender]').val(["女"]);

注意:val中参数的[]不能省略,val()的参数必须是一个数组

以上就是jQuery中怎么设置特殊属性,小编相信有部分知识点可能是我们日常工作会见到或用到的。希望你能通过这篇文章学到更多知识。更多详情敬请关注编程网行业资讯频道。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯