这里只是我学习的笔记,仅供自己需要时查询
first import the Jquery .js file, code is following:
$(“#testDiv”); 一个id为testDiv的元素的包装集
var div = document.getElementById(“testDiv”);
var domToJQueryObject = $(div);此时的domToJQueryObject表示一个jquery包装集。jQuery包装集是一个集合,使用索引器访问其中的一个元素
var domObject = $(“#testDiv”)[0];此时的domObject表示一个document对象。“$”符号在Jquery中代表对Jquery对象的引用,
jquery选择器就是 以一种字符串方式得到不同的Dom对象,以jquery包装集的形式返回
#选择器
# 选取带有唯一的指定 id 的元素。id 引用 HTML 元素的 id 属性。相同的 id 值只能在文档中使用一次。重复时,只读取第一个id*选择器
$(“body *”) 选择<body>内所有元素Chaining
允许我们在相同的元素上运行多条 jQuery 命令,$("#p1").css("color","red").slideUp(2000).slideDown(2000);
"p1" 元素首先会变为红色,然后向上滑动,然后向下滑动:css() 方法设置或返回被选元素的一个或多个样式属性。$("input").val();获取文本框中的值$("input").val("hello world!"); 设定文本框中的值$("p").text(); 返回P元素的文本内容 只显示文本$("p").text("Hello world!");设置所有P元素的文本内容$("p").html(); 返回p元素的内容。 (包括 HTML 标记) 比如
...$("p").html("Hello world!");设置所有P元素的内容$("a").attr("href");获得属性的值,可以是任何属性 |
.intro
{ background-color:yellow;}设置 class="intro" 的元素的样式,所有clsss为intro的元素,背景色会被设置为黄色$("p").each(function(i){this.style.color=['#f00','#0f0','#00f'][i]});
为索引分别为0,1,2的P元素设定不同的字体颜色$("tr").each(function(i){this.style.backgroundColor=['#bbb','#ddd'][i%2]});
给隔行的tr元素换色,实现表格的隔行换色<style >.clas *{border: 1px solid lightgrey;} </style><table class="clas">
给表格每个设置灰色边框