使用Jquery必须在页面内引入一个Jquery包

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

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

</head>

<body>

<div id="aa" bs="test"><span>DIV1</span></div>

<div id="bb" class="a">DIV2</div>

<div id="cc" class="a">DIV3</div>

<div id="dd" class="a">DIV4</div>

<input id="txt" bs="w" name="txt" value="hello" />

</body>

<script type="text/javascript">

$(document).ready(function(e) {

    //1.找到元素

    var a1 = document.getElementById("aa"); //JS找到的DOM对象

    var bd = document.getElementById("txt");

    //alert(a1);

    //var a2 = $("#aa"); //Jquery找到的是Jquery对象

    var bd1 = $("#txt");

    //alert(a2[0]);

    var b1 = document.getElementsByClassName("a");

    var b2 = $(".a");

    //alert(b2.eq(0)[0]);

    document.getElementsByTagName("div");

    $("div");

    document.getElementsByName("txt");

    var c1 = $("[name=txt]"); //属性筛选

    //alert(c1[0]);

    //2.操作内容

    //alert(a1.innerHTML);

    //a1.innerHTML = "<span style='color:red'>hello</span>";

    //a1.innerText="<span style='color:red'>hello</span>";

    //alert(bd.value);

    //bd.value = "world";

    //alert(a2.text());

    //a2.text("hello");

    //alert(a2.html());

    //a2.html("<span style='color:red'>hello</span>");

    //alert(bd1.val());

    //bd1.val("world");

    //3.操作属性

    //a1.getAttribute("bs");

    //a1.setAttribute("bs","");

    //a1.removeAttribute("bs");

    //alert(a2.attr("bs"));

    //a2.attr("bs","testjquery");

    //4.操作样式

    //a1.style.color = "red";

    //a1.style.fontSize = "24px";

    //alert(a2.css("color"));

    //a2.css("background-color","pink");

    //5.事件

    $("#aa").click(function(){

        $(this).css("background-color","red");

        alert("aa");

        })

    $(".a").click(function(){

        var s1 = $(this).text();

        alert(s1);

        })

    //6.Json数据

    var js = {

        "a":"hello",

        "b":123,

        "c":[1,2,3],

        "d":{"aa":5555,"bb":"hello world"},

        };

        });

</script>

</html>

php课程---JavaScript与Jquery的区别的更多相关文章

  1. php课程---JavaScript与Jquery的区别（转）

    jQuery能大大简化Javascript程序的编写,我最近花时间了解了一下jQuery,把我上手过程中的笔记和大家分享出来,希望对大家有所帮助.要使用jQuery,首先要在HTML代码最前面加上对j ...

  2. JavaScript和JQuery的区别

    一.本质上的区别 1.JavaScript 是通过<script></script>标签插入到HTML页面,可由所有的现代浏览器执行的一种轻量级的编程语言. 2.JQuery是 ...

  3. javascript与jquery的区别

  4. Jquery 复习练习（02）Javascript 与jquery 互转 onclick 与click区别

    Javascript 与jquery 互转 jquery 为<script src="jquery-1.8.3.js"></script> 以checkbo ...

  5. Web前端学习笔记之JavaScript、jQuery、AJAX、JSON的区别

    官网的英文解释: javascript和jQuery有点关系,js是一种脚本语言,主要用于客户端,现在主要用于实现一些网页效果. jquery是js的一个库,你可以认为是对js的补充,提供了很多方便易 ...

  6. JQuery和JavaScript常用方法的一些区别

    jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单,为了说明区别,下面与大家分享下JavaScript 与JQuery 常用方法比较   jquery 就 ...

  7. 【Ajax 4】Ajax、JavaScript和JQuery的联系和区别

    导读:在之前,就分别学习了Ajax.JavaScript和JQuery,然后对于这三者之间的关系,是一直云里雾里的.尤其是后来学到了Ajax,就更是不明白了.现在,就给总结总结. 一.基本概述 1.1 ...

  8. jQuery学习之路（7）- 用原生JavaScript实现jQuery的某些简单功能

    ▓▓▓▓▓▓ 大致介绍 学习了妙味,用原生的JavaScript实现jQuery中的某些部分功能 定义自己的函数库lQuery ▓▓▓▓▓▓ $()选择器的实现 jQuery是面向对象的,所以自己编写 ...

  9. JavaScript、Jquery选择题

    尚学堂Java EE软件工程师认证考试 试题库-选择题     一.    选择题(包括单选和双选) 1.B 在JavaScript中,以下变量命名非法的是(   )(选择一项) A. numb_1 ...

随机推荐

  1. express－12 Cookie与会话

    简介 HTTP是无状态协议.当浏览器中加载页面,然后转到同一网站的另一页面时,服务器和浏览器都没有任何内在的方法可以认识到,这是同一浏览器访问同一网站.换一种说法,Web工作的方式就是在每个HTTP请 ...

  2. http://zhidao.baidu.com/link?url=X7IUn1KtjVb0889-lR1OlNOl5xJaA49LEqPHvjTvfKJt5uXPsyi-sn-Xc-yw6-fbaIBvuF0MiTVZGpZGeoW_HLphIR5WmiMVDMoNBFAOINa

    http://zhidao.baidu.com/link?url=X7IUn1KtjVb0889-lR1OlNOl5xJaA49LEqPHvjTvfKJt5uXPsyi-sn-Xc-yw6-fbaIB ...

  3. 把Actor绑定到角色的插槽上

    void AMonster::PostInitializeComponents(){ Super::PostInitializeComponents(); // instantiate the mel ...

  4. storm进程正常运行一段时间shut down，运维方式

    storm启动一段时间后,无征兆的停止了,然后nimbus,supervisor,ui所有的worker都stop了. 我用的storm是0.8.2版本的 nimbus中留下的log如下 -- :: ...

  5. C#中js文本提示

    Page.ClientScript 与 ClientScript 的关系 这二者实际上是一个东西,后者只是省略了 Page.都是获取用于管理脚本.注册脚本和向页添加脚本的 ClientScriptMa ...

  6. BZOJ 1013 & 高斯消元

    题意: 告诉你一个K维球体球面上的K+1个点问球心坐标. sol: 乍一看还以为是K维的二分答案然后判断距离...真是傻逼了...你看乱七八糟的题目做多了然后就会忘记最有用的基本计算... 我们可以看 ...

  7. HDU 1686 & KMP

    题意: 求模板在匹配串所有子串中出现次数. SOL: 本题与普通kmp有一点不同,因为待匹配串中的模板串可能相互包含. 我们考虑正常的kmp是在怎么做的 i = 1 2 3 4 5 6 7 8 9 … ...

  8. Codeforces Round #248 (Div. 2) A. Kitahara Haruki's Gift

    解决思路是统计100的个数为cnt1,200的个数为cnt2 则 cnt1    cnt2 奇数      奇数 奇数      偶数 偶数      奇数 偶数     偶数 当cnt1为奇数时一定 ...

  9. phpunit测试成功 phpunit测试实践代码

    16:12 2015/12/8phpunit测试成功,代码写在www目录下,以类名命名代码文件,我的文件名为 ArrayTest.php,类名为ArrayTest,内部写了简单的测试代码:<?p ...

  10. jQuery取得select选中的值

    $("#sxselect").change(function(){ alert($("#sxselect option:selected").val()); } ...