jQuery2
来源:互联网 发布:淘宝怎样关店 编辑:程序博客网 时间:2024/05/05 17:50
jQuery DOM 操作
$("#btn1").click(function(){ alert("Text: " + $("#test").text()); //设置或返回所选元素的文本内容});$("#btn2").click(function(){ alert("HTML: " + $("#test").html()); //设置或返回所选元素的内容});$("#btn1").click(function(){ alert("Value: " + $("#test").val()); //获得输入字段的值});$("button").click(function(){ alert($("#w3s").attr("href")); //获得链接中 href 属性的值});
设置内容 - text()、html() 以及 val()
$("#btn1").click(function(){ $("#test1").text("Hello world!");//设置或返回所选元素的文本内容});$("#btn2").click(function(){ $("#test2").html("<b>Hello world!</b>");//设置或返回所选元素的内容(包括 HTML 标记)});$("#btn3").click(function(){ $("#test3").val("Dolly Duck");//设置或返回表单字段的值});$("button").click(function(){ $("#w3s").attr({ "href" : "http://www.w3school.com.cn/jquery", "title" : "W3School jQuery Tutorial" //attr() 方法也允许您同时设置多个属性 });});
添加/删除元素
$("p").append("Some appended text."); //在被选元素的结尾插入内容$("p").prepend("Some prepended text."); //在被选元素的开头插入内容$("img").after("Some text after");//在被选元素之后插入内容。$("img").before("Some text before");//在被选元素之前插入内容$("#div1").remove();//删除被选元素及其子元素$("#div1").empty();//删除被选元素的子元素
获取并设置 CSS 类
$("button").click(function(){ $("h1,h2,p").addClass("css类"); $("div").addClass("css类");});$("button").click(function(){ $("#div1").addClass("important blue");//同时多个类});$("button").click(function(){ $("h1,h2,p").removeClass("blue");//删除指定的 class 属性});$("button").click(function(){ $("h1,h2,p").toggleClass("blue");//切换添加删除});$("p").css("background-color");//返回首个匹配元素的 background-color 值$("p").css({"background-color":"yellow","font-size":"200%"});//设置或返回被选元素的一个或多个样式属性
尺寸
$("button").click(function(){ var txt=""; txt+="Width: " + $("#div1").width() + "</br>"; txt+="Height: " + $("#div1").height(); $("#div1").html(txt);});$("button").click(function(){ $("#div1").width(500).height(500);});
width() 方法设置或返回元素的宽度(不包括内边距、边框或外边距);
height() 方法设置或返回元素的高度(不包括内边距、边框或外边距);
innerWidth() 方法返回元素的宽度(包括内边距);
innerHeight() 方法返回元素的高度(包括内边距);
outerWidth() 方法返回元素的宽度(包括内边距和边框);
outerHeight() 方法返回元素的高度(包括内边距和边框);
outerWidth(true) 方法返回元素的宽度(包括内边距、边框和外边距);
outerHeight(true) 方法返回元素的高度(包括内边距、边框和外边距)。
阅读全文
0 0
- jquery2
- jquery2
- jquery2
- jQuery2
- jQuery2
- jQuery2
- jQuery2
- JQuery2------6.22
- jQuery2(JQuery实现onload)
- jQuery2.0.3源码分析
- 自己的连手的jquery2
- jquery2.0的新特性
- jQuery2.0发布之我见
- ASP.NET的CSS+JQuery2
- jquery2.0动态绑定事件
- 面向对象方法仿写JQuery2
- 关于jquery2.2.0这个版本的问题
- jQuery2.x源码解析(缓存篇)
- PAT甲级真题及训练集(26)--1106. Lowest Price in Supply Chain (25)
- 给团队带来正能量,避免负能量的产生
- POJ 1826 The Best Farm 笔记
- tensorflow遇到No module named 'input_data'
- Add Again UVA
- jQuery2
- linux源配置-yellowcong
- 002
- ios 数组排序
- struts2复习笔记
- myBatis之java.util.Date类型如何映射到mysql的datetime类型
- win7在虚拟机上用Djangodebug模式部署服务器的简要步骤
- Android开发的那些小秘密分享
- 《快学Scala》16章习题参考解答(XML)