JQuery学习笔记-Hello world

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript">
	$(function(){//相当于window.onload
		$("button").click(function(){
			//alert("Hello world!!!");
			alert($(this).text());
			//JQuery对象和DOM对象
			//获取一个JQuery对象
			var $btn = $("button");
			//JQuery对象是一个数组
			//alert($btn.length);

			//可以通过数组的下标转为DOM对象
			//alert($btn[0].firstChild.nodeValue);

			//由DOM对象转为JQuery对象
			var btn = document.getElementById("btn");
			//alert($(btn).text());

			//$("#id")  document.getElementById("id");
			//$("tagName")  document.getElementByTagName("tagName");
		});
	})
</script>
</head>
<body>
	<button id="btn">click me1</button>
	<button>click me2</button>
</body>
</html>
时间: 2024-11-02 13:12:55

JQuery学习笔记-Hello world的相关文章

jQuery学习笔记(一):入门

jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操作如下: 1 document.getElementById('info').value = 'Hello World!'; 使用JQuery时获取DOM文本操作如下: 1 $('#info').val('Hello World!'); 嗯,可以看出,使用JQuery的优势之一是可以使代码更加简练,使开

Js脚本之jQuery学习笔记(1)

Js脚本之jQuery学习笔记(1) 一.javascript基础 单行注释 多行注释 /* */ 数据类型 数值型 字符串型 布尔型 空值 未定义值 转义字符 函数定义:1234567891011121314<head><script language="javascript"function test(m){var xixi="嘻嘻"alert("这是javascript")document.write(xixi + m)}

jQuery学习笔记--JqGrid相关操作 方法列表(上)

1.获得当前列表行数:$("#gridid").getGridParam("reccount"); 2.获取选中行数据(json):$("#gridid").jqGrid('getRowData', id); 3.刷新列表:$(refreshSelector).jqGrid('setGridParam', { url: ''), postData: ''}).trigger('reloadGrid'); 4.选中行:$("#jqGrid

jQuery学习笔记10:Ajax技术

jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. jQuery 采用了三层封装:最底层的封装方法为:$.ajax(),而通过这层封装了第二层有三种方法:.load().$.get()和$.post(),最高层是$.getScript()和$.getJSON()方法. 函数 描述 jQuery.ajax() 执行异步 HTTP (Ajax) 请求. .ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序.这是一个

jQuery学习笔记之过滤器三(向上查找兄弟元素、向下查找兄弟元素)

向上查找兄弟元素的方法:prev方法.prevAll方法.prevUntil方法 向下查找兄弟元素:next方法.nextAll方法.nextUntil方法 向上查找兄弟元素 1.prev方法 2.prevAll方法 3.prevUntil方法 向下查找兄弟元素 1.next方法 2.nextAll方法 3.nextUntil方法 jQuery学习笔记之过滤器三(向上查找兄弟元素.向下查找兄弟元素)

JQuery学习笔记(1)

JQuery学习笔记(1) 认识JQuery 简介 JQuery是一个JavaScript库,语法简洁,有跨平台的兼容性,简化了开发人员遍历html文档.操作dom.处理事件.执行动画和开发Ajax的操作.理念是:写得少,做得多. 优点 1.轻量级.UglifyJS压缩后大小保持在30KB 2.选择器强大. 3.DOM操作封装. 4.可靠地事件处理机制. 5.完善的Ajax. 库类型 jquery.js(开发版) 约229kb,用于学习和开发. jquery.min.js(生产版) 约31kb,

jQuery学习笔记(2014年8月3日)事件委派

jQuery中的事件委托是通过 closest() 来完成的. closest() 方法获得匹配选择器的第一个祖先元素,从当前元素开始沿 DOM 树向上. 参考资料: jQuery 遍历 - closest() 方法http://www.w3school.com.cn/jquery/traversing_closest.asp jQuery学习笔记(2014年8月3日)事件委派

锋利的JQuery 学习笔记

第一章 认识JQuery ·页面加载事件(可以写多个ready())$(document).ready(function(){alert(“hello world”);}) ·链式操作:JQuery允许你在一句代码中操做任何与其相关联的元素,包括其子元素.父元素等//选择名称为myDiv的元素,为其自身添加css1的样式,然后再选择其所有子元素a,为其移除css2样式$(“#myDiv”).addClass(“css1″).children(“a”).removeClass(“css2″); ·

jQuery 学习笔记

jQuery 学习笔记 position()是相对父元素的,有top.left两个属性. offset()是相对于document的当前坐标. offsetParent()是获取离元素最近的有定位的父元素. .closet() 获取最近的匹配选择器的父元素. off()移除一个事件处理函数,要删除委托事件需提供对应的选择器. detch()和remove()一样,但是不会移除绑定数据,以便以后添加.empty()是清空该元素的所有子元素.

jQuery学习笔记——jQuery基础核心

代码风格 在jQuery程序中,不管是页面元素的选择.内置的功能函数,都是美元符号“$”来起始的.而这个“$”就是jQuery当中最重要且独有的对象:jQuery对象,所以我们在页面元素选择或执行功能函数的时候可以这么写: $(function () {}); //执行一个匿名函数 $(‘#box’);//进行执行的ID元素选择 $(‘#box’).css(‘color’, ‘red’);//执行功能函数由于$本身就是jQuery对象的缩写形式,那么也就是说上面的三段代码也可以写成如下形式:jQ