jQuery学习笔记（1）

最新推荐文章于 2024-01-20 21:49:50 发布

wq105032007067

最新推荐文章于 2024-01-20 21:49:50 发布

阅读量430

点赞数

分类专栏： html 文章标签： jquery javascript html function prototype css

本文链接：https://blog.csdn.net/wq_tft/article/details/7513044

版权

11 篇文章 0 订阅

订阅专栏

一、引用

jquery是经过封装后的javascript，使用jquery必须引jquery文件，共有两个版本的 jQuery 可供下载：一份是精简过的，另一份是未压缩的（供调试或阅读）。这两个版本都可从 jQuery.com 下载。

引用方式：

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
</head>

二、jQuery 语法

jQuery 语法是为 HTML 元素的选取编制的，可以对元素执行某些操作。

基础语法是：$(selector).action()

$(this).hide() - 隐藏当前元素

$("p").hide() - 隐藏所有段落

$("p.test").hide() - 隐藏所有 class="test" 的段落

$("#test").hide() - 隐藏所有 id="test" 的元素

$("p#demo") .hide() - 隐藏 id="demo" 的第一个 <p> 元素。

为了防止文档在完全加载（就绪）之前运行 jQuery 代码，所有 jQuery 函数最好位于一个 document ready 函数中，一般在页面初始化的时候使用即可：

$(document).ready(function(){

--- jQuery functions go here ----

});

三、选择器

1）使用 CSS 选择器来选取 HTML 元素。

$("p") 选取 <p> 元素。

$("p.intro") 选取所有 class="intro" 的 <p> 元素。

$("p#demo") 选取 id="demo" 的第一个 <p> 元素。

2）使用 XPath 表达式来选择带有给定属性的元素。

$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

3）CSS 选择器可用于改变 HTML 元素的 CSS 属性。

下面的例子把所有 p 元素的背景颜色更改为红色：

$("p").css("background-color","red");

四、事件

$("button").click(function() {..some code... } )

jQuery 使用 $ 符号作为 jQuery 的简介方式。

某些其他 JavaScript 库中的函数（比如 Prototype）同样使用 $ 符号。

jQuery 使用名为 noConflict() 的方法来解决该问题。

var jq=jQuery.noConflict()，帮助您使用自己的名称（比如 jq）来代替 $ 符号。

关注

专栏目录