jquery----->helloworld

<html>
<head>
<title>first jquery</title>

<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript">

    //$(function(){}) 相当于 window.onload, 代码卸载 {} 之间
    $(function(){
        //1. 选取 button: $("button")
        //2. 为 button 添加 onclick 响应函数: $("button").click(function(){})
        //代码编写在 function 的 {} 中.
        $("button").click(function(){
            //3. 弹出 helloworld
            alert("helloworld");
        });
    })

</script>
</head>
<body>
    <button id="button">ClickMe</button>
</body>
</html>

jQuery对象就是通过jQuery($())包装DOM对象后产生的对象。

var $variable=jQuery对象

var variable=DOM对象

由于jQuery对象是一个数组对象。所以可以根据下标转换成DOM对象。

alert($btn[0].firstChild.nodeValue);

由DOM对象转换成jQuery对象。使用$()包装

alert($(btn).text())

时间: 2024-10-15 09:56:36

jquery----->helloworld的相关文章

Writing Your Own jQuery Plugins

Setting Up 1 <script src="js/jquery-1.9.1.min.js"></script> 2 <script src="js/jquery.hello-world.js"></script> The jQuery Plugin Structure 1 (function($) { 2 3 $.fn.helloWorld = function() { 4 5 // Future home o

jQuery基本知识

jQuery知识结构 * jQuery入门?     * js函数库(DOM/ajax)     * 特点:         * HTML元素选取         * HTML元素操作         * CSS操作         * HTML事件处理         * JS动画效果         * 链式调用         * 浏览器兼容         * Ajax封装         * 易扩展插件     * helloworld         * 引入库           

jquerymobile的helloworld

现在项目需要用jquerymobile做手机版,开发过程中都是边用边学,下班没什么事,就系统学习一下jquerymobile,顺便把学习过程记录一下. 编写jquerymobile代码时,需要先在官网上下载jquerymobile的整个压缩包,其中对于开发有作用的只有三个文件,其中分别是:jquery.min.js.jquery.mobile-1.4.5.min.css.jquery.mobile-1.4.5.min.js.helloworld的具体源码如下: <!DOCTYPE html>

一步一步学习 JQuery (一) JQuery 对象

jQuery 是继 Prototype 之后又一个优秀的 JavaScript 库 jQuery 理念: 写得少, 做得多. 优势如下: 轻量级 强大的选择器 出色的 DOM 操作的封装 可靠的事件处理机制 完善的 Ajax 出色的浏览器兼容性 链式操作方式 JQuery:Hello World <html> <head> <meta charset="UTF-8"> <title>Insert title here</title&

jquery实例 苑的离去,感觉些许悲伤,保重 --- --- 苑,怨,缘。。。

左侧菜单 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>left_menu</title> <style> .menu{ height: 500px; width: 30%; background-color: gainsboro; float: left; } .content{ heig

基于JQuery的进度条实现

功能描述:顾名思义,既是形象地用柱状条长短变化表示进度变化过程的工具.如下图: 实现 组成:单看进度条的组成,外层是一个父标签,有一定长度,有边框,便于表现总的进度大小:里层是一个子标签,宽度为一定百分比的父标签宽度,并且背景色填充,有文本内容,文本居右,有一定内边距. 动画:为子标签设置一个轮询器,当宽度达到父标签宽度100%时,关闭轮询器,并做自定义操作 代码: HTML 1 <!doctype html> 2 <html> 3 <head> 4 <meta

Jquery 调用.net WebService 返回Json、XML方法

由于项目需要,使用前端.手机客户端调用ASP.NET的Webservice来获取信息.所以这段时间重温一下Jquery与Web Serivce,过程中碰到不少问题,也有不少的收获. Service代码 [WebMethod] public string HelloWorld() { return "Hello World"; } [WebMethod] public string myMethod(string para) { return "Hi," + para

Jquery Ajax调用aspx页面实例

目前,我会的几种asp.net界面与后台代码交互方式有几种: 1.webform+服务器控件交互: 2.webform+jquery+ajax+一般处理程序交互: 3.webform+jquery+ajax+Webservice/WCF交互: 4.MVC: 5.webform+jquery+ajax直接交互: 其中第1种交互是入门级,发展级为第2与第3,交互方式类似,也是我常用的开发方式.第4种最近几年才出现,玩过,用于项目比较少. 现在记录一下第5种交互方式. 第一步:准备页面代码: <!DO

JS扩展 或 Jquery的扩展写法

<script>//JS扩展String函数test,其它类推String.prototype.test = function(s){ alert(this+s);}var str = 'hello';str.test('world');//helloworld //JQ扩展(function($){ $.fn.test = function(op){ var defaults = {a:'no'} var setings = $.extend(defaults,op); alert(seti

Jsoup(一)-- HelloWorld

1.简介 jsoup 是一款Java 的HTML解析器,可直接解析某个URL地址.HTML文本内容.它提供了一套非常省力的API,可通过DOM,CSS以及类似于jQuery的操作方法来取出和操作数据.实际开发中,利用HttpClient来抓取网页内容,然后利用 jsoup来解析.文档可参考:http://www.open-open.com/jsoup/ 2.maven依赖 <dependency> <groupId>org.jsoup</groupId> <art