JavaScript

1.概述

JavaScript是一种基于对象和事件驱动，并具有安全性能的脚本语言。

2.语法

HTML 中的脚本必须位于 <script> 与 </script> 标签之间。

脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中；

多数情况下放在<head>部分中，可优于其他代码被加载执行。

例：

<!DOCTYPE html>

<html>

<body>

<h1>我的 Web 页面</h1>

<p id="demo">一个段落</p>

<button type="button" onclick="myFunction()">尝试一下</button>

<script> function myFunction()

{

document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";

}

</script>

</body>

</html>

2.1 innerHTML

innerHTML在JS是双向功能： 获取对象的内容  或  向对象插入内容。

语法：

HTMLElementObject.innerHTML=text

例：

<div id="aa">这是内容</div>

可通过document.getElementById('aa').innerHTML 来获取id为aa的对象的内嵌内容；

也可以对某对象插入内容：

document.getElementById('abc').innerHTML='这是被插入的内容';

//向id为abc的对象插入内容。

2.2链接脚本文件

格式：

<head>

<script type=”text/javascript” src=”xxx.js”></script>

</head>

注：.js文件中只有脚本，不包含HTML标记。

 JQuery

1：概述

Jquery是js的一个工具库

2：jquery的功能

HTML 元素选取

HTML 元素操作

CSS 操作

HTML 事件函数

JavaScript 特效和动画

HTML DOM 遍历和修改

AJAX

Utilities

除此之外，Jquery还提供了大量的插件。最常见的是jquery UI和jquery easyui。

3：引用jquery

<head>

<script src="jquery-1.10.2.min.js"></script>

</head>

4：语法

$(selector).action()

例：$(this).hide() - 隐藏当前元素

$("p").hide() - 隐藏所有 <p> 元素

$("p.test").hide() - 隐藏所有 class="test" 的 <p> 元素

$("#test").hide() - 隐藏所有 id="test" 的元素

5：关于入口函数与JS的区别

jquery的入口函数：

$(document).ready(function(){

// 执行代码

});

或者

$(function(){

// 执行代码

});

JavaScript 入口函数:

window.onload = function () {

// 执行代码

}

jQuery 的入口函数是在 html 所有标签(DOM)都加载之后，就会去执行。

JavaScript 的 window.onload 事件是等到所有内容，包括外部图片之类的文件加载完后，才会执行。

6：事件处理区别

事件源：

Js：document.getElementById(“id”)

jQuery：$(“#id”)

事件：

Js :document.getElementById(“id”).onclick

jQuery: $(“#id”).click

注：jQuery的事件不带on

事件处理程序：

Js :

document.getElementById(“id”).onclick = function(){// 语句}

jQuery :

$(“#id”).click(function(){// 语句});

(第6点有参考，链接我忘记了，谁知道的话帮我贴一下）

javascript实例参考：http://www.runoob.com/js/js-examples.html

jquery实例参考：http://www.runoob.com/jquery/jquery-examples.html

javascript和jquery的更多相关文章

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

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

  2. Error: Bootstrap's JavaScript requires jQuery错误

    引入bootstrap时会出现的问题:boostrap下拉菜单无效,浏览器报Uncaught Error: Bootstrap's JavaScript requires jQuery错误, 解决办法 ...

  3. 【JavaScript与JQuery获取H2的内容】

    撰写日期:2016-7-13 11:05:07 JavaScript与JQuery获取DOM内容是有区别的,接下来看一例子 栗子: Jquery-获取H3中的内容然后Dom转换为Jquery < ...

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

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

  5. 最流行的JavaScript库jQuery不再支持旧版IE

    直到JQuery2.0的发布,流行的jQuery JavaScript库到了一个重要里程碑.2.0版本比前任版本在大小上缩减了12%,但是更大的新闻是,jQuery 2.0不在对IE6,7,8三个版本 ...

  6. 原生javascript和jquery实现简单的ajax例子

    后台C#代码 public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/p ...

  7. 在C#后端处理一些结果然传给前端Javascript或是jQuery

    在C#后端处理一些结果然传给前端Javascript或是jQuery,以前Insus.NET有做过一个例子<把CS值传给JS使用 >http://www.cnblogs.com/insus ...

  8. Javascript配合jQuery实现流畅的前端验证

    做前端时一般都习惯用JavaScript进行表单的简单验证比如非空验证和正则表达式验证,这样过滤后的数据提交到服务端再由专门的控制器做数据处理,这样能减轻服务器的负担,下面看一下前端验证的简单步骤: ...

  9. JavaScript、Jquery选择题

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

  10. javascript和jquery中获取列表的索引

    网页中的图片预览一般都需要获取图片列表的索引,或则图片对应的标签的索引,以此达到点击相应的标签获取索引,显示相应的图片 列表有很多种表达的方式,一种是 <ul> <li>苹果& ...

随机推荐

  1. 关于mysql的权限的问题

    昨天因为同学的mysql数据库不知道做了什么操作,从而导致root用户无法使用了 具体是使用root用户不需要密码 进去只能看 看到 infomation_schema 表 ,感觉root权限丢失了 ...

  2. 去sqlserver日志

    USE [master] GO ALTER DATABASE DNName SET RECOVERY SIMPLE WITH NO_WAIT GO ALTER DATABASE DNName SET  ...

  3. P1487 失落的成绩单

    P1487 失落的成绩单a[i]=a[i-2]-2.0*a[i-1]+2.0*d;a[2]越大,a[3]越小a[3]越大,a[4]越小所以a[2]越大,a[4]越大,a[3]越小就有了单调性,分奇偶进 ...

  4. ps去除元素的三种常用方法

    1.仿制图章工具,alt+鼠标左键进行选取复制区域,然后左键点击需要覆盖的区域. 2.套锁工具--选择区域--右键填充--内容识别.     3.修补工具,选中区域--拖动适配.     附带另一份较 ...

  5. 【JZOJ3294】【BZOJ4417】【luoguP3990】超级跳马

    description analysis 矩阵乘法好题 最朴素的\(10pts\)的\(f[i][j]\)容易\(DP\),但是是\(O(nm^2)\)的复杂度 于是把\(10\)分的\(DP\)写出 ...

  6. php上传(三)

    关于一些上传插件的运用 JQuery上传插件Uploadify使用详解 http://www.cnblogs.com/oec2003/archive/2010/01/06/1640027.html

  7. PHP PDO 事务与自动提交

    现在通过 PDO 连接上了,在开始进行查询前,必须先理解 PDO 是如何管理事务的. 事务支持四大特性(ACID): 原子性(Atomicity) 一致性(Consistency) 隔离性(Isola ...

  8. NX二次开发-UDO用户自定义对象(UFUN)【持续完善】

    每当提起UDO总是会让我想起大专毕业那会失业找工作,后来有个宝贵机会去了软件公司上班,拿到了我人生中的第一个NX二次开发项目,一个关于测量汽车前后左右摄像头的项目.当时那个项目就用到了UDO,对于只看 ...

  9. faster-rcnn代码阅读-proposal层

    这一节讲述proposal层,和这一层有关的结构图如下: proposal层的prototxt定义如下: layer { name: 'proposal' type: 'Python' bottom: ...

  10. day 91 Django学习之django自带的contentType表

      Django学习之django自带的contentType表   通过django的contentType表来搞定一个表里面有多个外键的简单处理: 摘自:https://blog.csdn.net ...