首先当你调用JQ时,应该先验证是否加载成功$(document).ready(function(){
写入语句;
});
———————————————————-
1、$("") JQ中获取文本内容的函数
也可以是JQquery("")但是这种方法一般是在函数中有jq冲突的时候才会使用的一种方式
2、还有获取局部的方式:$("#mydi").html("字符串"或(变量));,也就是说可以直接通过便签的id直接获取局部的内容
3、通过标签获取:$("标签").html("");
4、当然了获取了标签的内容你可以修改:$("div").html("新内容");,也可以在$("div").css("属性","值")
5、通过过滤选择器:(相同名字的标签:has(你想要改变的标签名))
6、通过隐藏的过滤选择器:—-便签名:hidden
7、通过属性选择器进行选取内容:("标签[属性='属性值']")
8、
<script type="text/javascript"> $(function(){ $("a").click(function(){ if($("a").html()=="更多"){ $("li").show(); $("a").html("简化"); }else{ $(".li1").hide(); $(".li2").hide(); $("a").html("更多"); } }); })</script></head><body><ul> <li>1 <li>2 <li>3 <li>4<li class="li1" style="display:none">5<li class="li2">8</li></li> </li> </li> </li> </li></ul><div></div> <a href="javascript:">更多</a>
本页跳转改变内容的例子
9、为表单增加样式:
<body> <h3>修改全部表单元素的背景色</h3> <form id="frmTest" action="#"> <input type="button" value="Input Button" /><br /> <select> <option>Option</option> </select><br /> <textarea rows="3" cols="8"></textarea><br /> <button> Button</button><br /> </form></body><script type="text/javascript"> $("#frmTest :input").addClass("bg_blue");</script>
其中第一个获取的参数#frmTest是整个表单的,然后后面的(:input)是单独的表单,后面addClass是为表单增加类标签名字叫(bg_blue)的样式
.bg_blue { background-color: blue; }
使用attr()方法控制元素的属性
1、attr(属性名,属性值)
—-attr获取的像上面的标签一样都是获取的内容整体
——结果——–
attr()方法设置元素属性点我就变
2、操作元素的内容
使用html()和text()方法操作元素的内容,当两个方法的参数为空时,表示获取该元素的内容,而如果方法中包含参数,则表示将参数值设置为元素内容。
3、通过addClass()和css()方法可以方便地操作元素中的样式,前者括号中的参数为增加元素的样式名称,后者直接将样式的属性内容写在括号中
4、
移除属性和样式
使用removeAttr(name)和removeClass(class)分别可以实现移除元素的属性和样式的功能,前者方法中参数表示移除属性名,后者方法中参数则表示移除的样式名
5、
使用append()方法向元素内追加内容
append(content)方法的功能是向指定的元素中追加内容,被追加的content参数,可以是字符、HTML元素标记,还可以是一个返回字符串内容的函数。
例如,在页面的<body>元素中追加一个具有“id”、“title”属性和显示内容的<div>元素
———————————————————
自定义JQ事件
$(document).ready(function(){
$("获取的ID").click(function(){
var e = JQuery.Event("MyEvent");//自定义实例化一个对象方法
$("获取的ID").trigger(e);
});
$("获取的ID").bind("MyEvent",function(event){
console.log(event);
//打印传进来的参数
})
});
6、append()添加内容方法
append(里面添加的内容如果是被赋值的变量就不用加双引号,,如果是函数调用只要写出–函数名()即可),如果是直接在里面加文字就要加上双引号然后再添加文本
7、$(想把它添加在哪的标签或者变量).appendTo()(“插入的位置”—要加引号)
——append()和appendTo()的不同用法
前者是先声明要在那里加入元素
后者是先添加你要添加的元素,然后To就是填到哪里去
8、clone()方法可以复制生成一个被选中的元素
$(你要复制的元素或者HTML标签).clone()
——————————————————–
确保加载之前的操作jQ的操作一般都要加
$(document).ready(function(){
你要写的函数和事件。。。。。
});
9、伪类的绑定事件
$("绑定的元素或者标签").hover(over:就相当于你把鼠标放在上面看到的样式,out是你把鼠标拿走显示的样式)
—————–
示例:
$(document).ready(function(){
$("div").hover(
function(){
$("this").addClass("样式");
},
function(){
$("this").removeClass("样式");
}
);
});
———————–
####绑定多个元素的事件时,事件事件之间只要用空格隔开就可以#####