jQuery控制DOM对象

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>控制DOM对象</title>
    <style type="text/css" >
        @import url(../../CSS/1-3.css);  /*使用import 方法引用CSS*/
    </style>
    <script type="text/javascript" src="../../JQuery/jquery-2.1.4.min.js">
    </script>
    <script type="text/javascript">
        $(function () {
            $("#Button1").click(function () {
                //获取文本框的值
                var oTxtValue = $("#Text1").val();
                //获取单选按钮的值
                var oRdoValue = $("#Radio1").is(":checked") ? "男" : "女";
                //获取复选框按钮只
                var oChkValue = $("#Checkbox1").is(":checked") ? "已婚" : "未婚";
                //显示提示文本元素和内容
                $("#divTip").css("display", "block").html(oTxtValue + "<br>" + oRdoValue + "<br>" + oChkValue);
            })
        })
    </script>
</head>
<body>
<div class="divFrame">
    <div class="divTitle">请输入如下信息</div>
    <div class="divContent">
        姓名:<input id="Text1" type="text" class="txtCss"/><br />
        性别:<input id="Radio1" name="rdoSex" type="radio" value="男" /> 男
              <input id="Radio2" name="rdoSex" type="radio" value="女" /> 女
        婚否: <input id="Checkbox1" type="checkbox" />
        <div class="divBth">
            <input id="Button1" type="button" value="提交"/>
        </div>
        <div id="divTip" class="divTip"></div>
    </div>
</div>
</body>
</html>
时间: 2024-11-05 17:34:30

jQuery控制DOM对象的相关文章

jQuery3访问并且控制dom对象

3.控制dom对象 下面是代码示例(本人费了九牛二虎之力调试,从c++跳到Java 路也不是那么好走),特别注意的地方:代码中所有的字符包括符号必须是英文的,jsp.JavaScript.css大小写不一致,不区分大小写的鄙人知道的也就只有sql了:另外需要注意的地方,jQuery调用dom对象的时候用到$(#对象的id) 千万别把#号忘掉. 提供一个比较好的调试方法,想JavaScript中加入alert(...)来断定程序可以抵达什么地方,病灶在哪里,不管C++还是Java调试方法都是一样的

jQuery - 01. jQuery特点、如何使用jQuery、jQuery入口函数、jQuery和DOM对象的区别、jQuery选择器、

this指的是原生js的DOM对象 .css(""):只写一个值是取值,写俩值是赋值 window.onload   ===   $(document).ready(); $(""):获取元素   标签名..类名.#id jQuery特点 链式编程 jq.shou(3000).html(内容) 相当于 jq.shou(3000) jq.gtml(内容) 隐式迭代 隐式实用for循环.迭代 如何使用jQuery 引包 一定要在使用之前 <script src =

Jquery与DOM对象

在第一次学习jquery中,常常会不能分辨DOM对象和Jquery对象,下面我们就简诉一下它们之间的关系和区别 1.DOM对象(Document Object Model) 文档对象模型,每一份DOM都可表示为一棵树,例如下面是一个简单的网页代码: 表示为DOM为: 我们可以通过JS中的getelementsByTayName或getelementsByTayId来获取树中的节点,像这样获取到的元素就是DOM对象,DOM可以使用JS中方法,例如: var domobj=document.gete

jQuery介绍 DOM对象和jQuery对象的转换与区别

jQuery介绍 DOM对象和jQuery对象的转换与区别 jQuery介绍 jQuery: http://jquery.com/ write less, do more. jQuery Hello World程序 <script type=“text/javascript” src=“xxx//jquery-x.y.z.js"> 引入jQuery.存在两个版本,jquery-x.y.z.min.js是精简压缩版,不带min的是开发版,代码中的注释和缩进等都被保留了. 注意路径中的”

jQuery、DOM对象傻傻分不清楚

初学jQuery时,经常分辨不清楚哪些是jQuery对象,哪些是DOM对象.这是十分不好的现象.必须明确区分何为jQuery对象.何为DOM对象,对于后续的学习.理解才更方便. 先从DOM对象开始,之后在谈谈jQuery对象(jq对象基于DOM对象). DOM.DOM对象 DOM(Document Object Model,文档对象模型),DOM是W3C的标准.定义了访问HTML和XML文档的标准. 文档对象模型是中立于平台和语言的接口,允许程序和脚本动态的访问和更新文档的内容.结构以及样式,更

【Jquery对象】jquery与dom对象的区别

最近工作有很多判断的代码,用到了jquery与dom对象的地方比较多,写在这里加强下基本概念: 1.判断是否存在时候,要用dom对象,因为jQuery在获得对象的时候,无论要获得的对象是否存在,都会返回jQuery对象 2.jquery对象与dom对象的转换: jQuery对象就是通过jQuery包装DOM对象后产生的对象(集合对象).jQuery对象是jQuery独有的,可以使用jQuery里的方法.因此jQuery对象和DOM对象是不一样的,不能调用对方定义的方法.所以$(‘#test’).

jquery和dom对象相互转化的方法

jQuery对象转成DOM对象: 两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index); (1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象. 如:var $v =$("#v") ; //jQuery对象 var v=$v[0]; //DOM对象 alert(v.checked) //检测这个checkbox是否被选中 (2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象 如:va

jQuery和DOM对象

html示例 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> </head> <body> <img id="img1" src="" alt=""></img> </body> jQuery对象 $("#i

jquery中 dom对象与jQuery对象相互转换

var jq = $(dom对象);//额 再补充点吧好记. $是jquery的别名.这一句等价于 var jq = jQuery(dom对象); 反之. dom对象 = jq[0]; //不写那么长了,简单明了些.感觉dom对象和jquery对象大家应该能分清.话说好多时候还是jQuery对象好用的多.