`
vowtree
  • 浏览: 34607 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

jQuery 即学即用 获取控制属性

阅读更多
<html>
<head>
<title></title>
<script src="jquery-1.6.2.js" type="text/javascript"></script>
<script type="text/javascript">
    function f()
    {
        $("#emptyTest").empty();
    }
    function f2()
    {
        $("p[class=emptyTest]").remove();
    }
</script>
</head>
<body>
    <p id="emptyTest">empty</p>
    <p class="emptyTest">准备删除</p>
    <p class="emptyTest">准备删除</p>
    <input type="button" value="go" onclick="f()">
    <input type="button" value="go" onclick="f2()">
</body>
</html>

 

 

$("p#one,p#two").click(function() {
	$(this).toggleClass("redbox");   //如果指定的类名存在,则删除,否则追加
});
		   
var cnt=1;
$("p#three").click(function(){
	$(this).toggleClass("redbox",cnt++%3==0);	//条件表达式为真,追加,为假,则删除
});

 

   

<html>
<head>
<title></title>
<script src="jquery-1.6.2.js" type="text/javascript"></script>
<script type="text/javascript">
    function f()
    {
       $(document).ready(function(){
            //改变所有p标签属性
            $("p").attr({style:'border:1px solid #f00;',alt:'设置style属性'});
            var oneTg=$("p#one").attr("title"); //获取第一个标签的title属性
            $("p#one").html(oneTg+"的title属性取得,并显示");
            /**/
            $("p#two").attr("title","修改two的title属性");
            $("p#three").attr("title",function(){
                var title =this.id;
                return title;
            })
            .each(function(){
                $(this).html("title属性与下一个id属性取一样的值"+this.title);
            });
       });
    }
</script>
</head>
<body>
    <p id="one" title="第一个">第一个</p>
    <p id="two" title="第二个">改变第二个</p>
    <p id="three" title="第三个">第三个</p>
    
    <input type="button" value="go" onclick="f()">
</body>
</html>

 

  

<html>
<head>
<title></title>
<script src="jquery-1.6.2.js" type="text/javascript"></script>
<script type="text/javascript">
    function f()
    {
       $(document).ready(function(){
            var one1=$("p#one").html();
            $("p#two").html(one1);
       });
    }
</script>
</head>
<body>
    <p id="one">第一个</p>
    <p id="two">变成第一个</p>      
    <input type="button" value="go" onclick="f()">
</body>
</html>

  

  

<html>
<head>
<title></title>
<script src="jquery-1.6.2.js" type="text/javascript"></script>
<script type="text/javascript">
    function f()
    {
       $(document).ready(function(){
            var one1=$(":text#one").val();
            $(":text#two").val(one1);
       });
    }
</script>
</head>
<body>
    <input type="text" id="one" value="one"/>
    <input type="text" id="two" value="two"/>         
    <input type="button" value="go" onclick="f()">
</body>
</html>

 

  

<html>
<head>
<title></title>
<script src="jquery-1.6.2.js" type="text/javascript"></script>
<script type="text/javascript">
    function f()
    {
       $('p').hide();
       $('button#one').bind('click',function(){
            $('p#two').toggle();
       });
    }
</script>
</head>
<body>
    <p id="two">显示/隐藏</p>
    <button id="one">提交</button>           
    <input type="button" value="go" onclick="f()">
</body>
</html>

 

 

 

 

分享到:
评论

相关推荐

    jQuery权威指南-源代码

    最后以两个具有代表性的综合案例结束全书,希望能帮助读者将前面所学的理论知识真正贯穿于实践中,迅速进入jQuery的殿堂。 作者简介: 陶国荣,资深Web技术专家,有10余年开发经验,是国内较早专业从事Web开发的...

    jQuery详细教程

    jQuery 使用 XPath 表达式来选择带有给定属性的元素。 $("[href]") 选取所有带有 href 属性的元素。 $("[href='#']") 选取所有带有 href 值等于 "#" 的元素。 $("[href!='#']") 选取所有带有 href 值不等于 "#" 的...

    jQuery权威指南366页完整版pdf和源码打包

    2.3.4 代码分析 2.4 本章小结 第3章 jquery操作dom 3.1 dom基础 3.2 访问元素 3.2.1 元素属性操作 3.2.2 元素内容操作 3.2.3 获取或设置元素值 3.2.4 元素样式操作 3.3 创建节点元素 3.4 插入...

    jQuery EasyUI 1.4 离线简体中文API文档 含完整开发工具包+皮肤+扩展+演示

    (题外话:从本次开始 我新增了jQuery EasyUI的专题页面 大家可以关注我的专题页来及时获取最新的EasyUI资源 专题页地址如下http:http://download.csdn.net/album/detail/343 同时也希望转载的那些朋友能保留我资源...

    jQuery学习笔记之控制页面实现代码

    each()遍历元素(k1) 代码如下: $(document).ready(function () { $(“#btn”).html(“each()遍历... 获取属性的值(k1)attr(name) 代码如下: $(document).ready(function () { $(“#btn”).html(“获取属性值”).

    python入门到高级全栈工程师培训 第3期 附课件代码

    03 风湿理论之函数即变量 04 函数递归 05 函数递归补充 第16章 01 上节课回顾 02 函数作用域 03 函数作用域补充 04 匿名函数 05 函数式编程介绍 06 函数式编程尾递归调用优化 07 map函数 08 map函数filter函数 09 ...

    JS学习笔记相关代码-测试代码

    &lt;progress value="50" max="100"&gt;&lt;/progress&gt;以实现进度条的变更控制,从后台获取数据,并计算其百分比并显示在前端。 分别使用progress-bar,progress-bar-warning,progress-bar-danger,progress-bar-success表示其...

    精通AngularJS part1

    通过$transclude在指令控制器中获取嵌入函数253 使用嵌入创建一个if指令253 在指令中使用priority属性255 93理解指令控制器256 为指令控制器注入特殊依赖257 创建一个基于控制器的分页指令258 理解指令控制器...

    DotNetTextBox V6.0.10 商业版 下载 (已知最新)

    (此功能测试稳定后会改为默认功能,即控件默认状态下输出的就是符合XHTML标准的代码,现在暂时请用xhtml属性来开启转换) 2008/6/23 Version 5.0.6 For VS2005/2008 Updates: 1)修正控件Length属性统计的字符...

    JAVA上百实例源码以及开源项目源代码

    EJB来模拟银行ATM机的流程及操作:获取系统属性,初始化JNDI,取得Home对象的引用,创建EJB对象,并将当前的计数器初始化,调用每一个EJB对象的count()方法,保证Bean正常被激活和钝化,EJB对象是用完毕,...

    JAVA上百实例源码以及开源项目

    EJB来模拟银行ATM机的流程及操作:获取系统属性,初始化JNDI,取得Home对象的引用,创建EJB对象,并将当前的计数器初始化,调用每一个EJB对象的count()方法,保证Bean正常被激活和钝化,EJB对象是用完毕,...

    Java JDK 7学习笔记(国内第一本Java 7,前期版本累计销量5万册)

    译作:《ajax实战手册》、《jquery实战手册(第2版)》 个人网站:http://openhome.cc 目录 《java jdk 7学习笔记》 chapter1 java平台概论 1 1.1 java不只是语言 2 1.1.1 前世今生 2 1.1.2 三大平台 5 ...

Global site tag (gtag.js) - Google Analytics