jquery

Posted 下一个秋天

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jquery相关的知识，希望对你有一定的参考价值。

1.调用dom对象跟jquery对象的差别

<body>
<input type="text" value="累成狗了知不知道" ID=“username” name="username" >
</body>

输出一个dom 对象：

<script type="text/javascript">
var shuchu=document.getElementById("username");获取ID给一个对象
alert(shuchu.value);//打印输出语句，dom对象（对象名直接取名字不加$区分，方便区分dom跟jquery对象）

</script>

输出一个jquery对象：

<script type="text/javascript">

var $jqy= $(shuchu)//dom对象转成jquery对象(jquery对象就是jquery用$（）方法把dom对象封装起来，用$方便区分对象)
alert($jqy.val())//用val()方法调用对象$jqy里面value的值
</script>

2.怎么把dom对象变成jquery变成一个dom对象

方法一：把jquery当做一个数组来取值,让dom对象拿到文本的ID

<body>
<input type="text" value="用户名" id="username" name="usename">
</body>

<script type="text/javascript">
var user=$("#username")[0];//把jquery当做一个数组来取值dom对象,拿到ID,0是表示这里只有一个数值，可以定义多个
alert("user.value");

方法二：调用jquery的对象，获取封装的dom对象。在把jaquery对象里的值传到一个新的对象里。

<body>
<input type="text" value="用户名" id="username" name="usename">
</body>

<script type="text/javascript">

var $user=$("#username");//方法二，调用jquery的对象，获取封装的dom对象。
var user=$user.get(0);
alert(user.value);

 

3.jquery是javascript中比较常用的一种，可以用少量的代码达到更多的效果。那么dom跟jquery输出的值又有什么不同呢？

一下通过一个小例子来看一下：

3.1一下是一个dom对象输出的方法：

<body>
<input  type="text"  value="我是上文 ”  ID="text1"  name="test1">
<input  type="text"  value="我是下文 ”  ID="text2"  name="test2">
</body>
<script type="text/javascript">
var text=document.getElementById("text")；
alert(text.value);
</script>

当它获取对象的ID出错写成text时，结果如下：

3.2一下是一个jquery对象输出的方法：

<body>
<input  type="text"  value="我是上文 "  ID="text1"  name="test1">
<input  type="text"  value="我是下文 "  ID="text2"  name="test2">
</body>
<script type="text/javascript">
//var text=document.getElementById("text1");
var $text=$("#text");
//alert(text.value);
alert($text.val());
</script>

这样写按理说应该输出一个提示框，不知道为什么没反应。

 

以上是关于jquery的主要内容，如果未能解决你的问题，请参考以下文章

markdown 在WordPress中使用jQuery代码片段

使用 NodeJS 和 JSDOM/jQuery 从代码片段构建 PHP 页面

很实用的JQuery代码片段（转）

几个有用的JavaScript/jQuery代码片段（转）

几个非常实用的JQuery代码片段

高效Web开发的10个jQuery代码片段