用表格做的,想要对比的内容一目了然,红色部分为重点

 

js

jquery

取元素

id:

document.getElementById("aa");

取到的是dom对象

class:

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

取到的是dom对象集

a.[0]取到的是第一个class名为aa的元素

tag:

document.getElementsByTagName("div");

name:

document.getElementsByName("aa");

ID:

$a=$("#aa")

取到的是jquery对象;

$a[0] 取到的是dom对象

Class:

$a=$(".aa")

取到的是jquery对象;

$a.eq(0)取到的是dom对象集;

$a.eq(0)[0]取到的是第一个class名为aa的元素

tag:

Tag:  $("div")

根据属性:

$("[bs=1]")

操作内容

非表单元素:

赋值:a.innerText = "ceshi";

取值:alert(a.innerText);

赋值:a.innerHTML = "ceshi";

取值:alert(a.innerHTML);

非表单元素:

赋值:a.text("hello");

取值 alert(a.text());

赋值:a.html("aaa");

取值:alert(a.html());

表单元素:

赋值:a.value = "请输入用户名";

取值:alert(a.value);

表单元素:

赋值:a.val("aa");

取值:alert(a.val());

操作属性

 

a.getAttribute("bs");获取属性

a.setAttribute("test","test");  添加属性

a.removeAttribute("bs");   移除属性

a.attr("bs"));   获取属性

a.attr("test","test"); 添加属性

a.removeAttr("bs"); 移除属性

操作样式

alert(a.style.color); 获取样式

a.style.color = "green"; 设置样式

注:

1、只能操作内联

2、style里的background-color属性在js中会变成backgroundColor

alert(a.("color")); 获取样式

a.css("background-color","red");设置样式

注:

1、可以操作内联,内嵌,外部

2、style里的background-color属性在jquery中不变

加事件

 

onblur="b()"

$("#cc").blur(function(){

alert("失去焦点了");

})

注:没有函数名的函数为匿名函数

js与jquery基础知识对比(一)---2017-05-06的更多相关文章

  1. js与juery基础知识对比(一)---2017-05-06

    用表格做的,想要对比的内容一目了然,红色部分为重点   js jquery 取元素 id: document.getElementById("aa"); 取到的是dom对象 cla ...

  2. 0417 jQuery基础知识

    jQuery基础知识 jQuery需要引入一个js文件,并且这个文件在所有js代码之前(包括引入的其他js文件) 基础操作(对比js): 1.找标签: js:document.getElement.. ...

  3. jquery基础知识汇总

    jquery基础知识汇总 一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库.源码戳这 jQu ...

  4. JQuery基础知识(1)

    JQuery基础知识(1) 对JQuery学习中遇到的小细节进行了整理和总结 1.JQuery hide()和show()方法,分别对选中的元素进行隐藏和显示,语法:hide()和show分别有对应的 ...

  5. JQuery基础知识(2)

    JQuery基础知识(2) JQuery滑动效果 1. JQuery slideDown(); 语法: $(selector).slideDown(speed,callback); 可选的 speed ...

  6. JQuery基础知识梳理篇

    这周没事,优化线上项目,因为前端都在赶项目,我又若菜.于是前端数据展示也要自己来.看javascript看到吐,决定梳理一下Jquery基础知识.敲黑板) 闲扯结束,进入正题. 选择器 介绍 jque ...

  7. js与jQuery实现方式对比汇总

      CreateTime--2016年12月16日09:11:23Author:Marydonjs与jQuery实现方式对比汇总 <div id="ListContainer" ...

  8. 2017年12月24日 JS跟Jquery基础

    js基础 alert();confirm(); 基础语法:与C#一致数据类型及类型转换var (string,decimal)parseInt()parseFloat();isNaN(); 运算符:数 ...

  9. three.js学习笔记--基础知识

    基础知识 从去年开始就在计划中的three.js终于开始了 历史介绍 (摘自ijunfan1994的转载,感谢作者) OpenGL大概许多人都有所耳闻,它是最常用的跨平台图形库. WebGL是基于Op ...

随机推荐

  1. 【Oracle】闪回表

    语法: FLASHBACK TABLE [ schema. ] table [, [ schema. ] table ]... TO { { { SCN | TIMESTAMP } expr| RES ...

  2. MatLab之HDL coder

    1 Workflow The workflow for applying HDL code generation to the hardware design process requires the ...

  3. 实现Android-JNI本地C++调试

    1.       原文链接:NDK单步调试方法 如有问题或者版权要求,请拜访原作者或者通知本人. 最近为了性能需求,开始搞JNI,白手起搞真心不容易.中间差点崩溃了好几次,最终总算得到一点心得. JN ...

  4. win8使用教程

    win8如何关机 http://product.pconline.com.cn/itbk/software/win8/1305/3301394.html shutdown.exe -s -t 00 W ...

  5. (转)Jetty实战之 安装 运行 部署

    http://blog.csdn.net/kongxx/article/details/7218767 本文地址:http://blog.csdn.NET/kongxx/article/details ...

  6. 一键安装本地yum仓库脚本

    #!/bin/bash#By:zhaocheng#Date:2019-01-18#Version v1 [ -d /media/cdrom ] || mkdir /media/cdrom[ -d /m ...

  7. shell常用语法

    for.if条件: https://blog.51cto.com/qiufengsong/1252889 一.for循环: );do echo $i done ###第一行:seq是指1到10,第二行 ...

  8. (C/C++学习)3.C++中cin的成员函数(cin.get();cin.getine()……)

    说明:流输入运算符,在一定程度上为C++程序的开发提供了很多便利,我们可以避免C语言那种繁琐的输入格式,比如在输入一个数值时,还需指定其格式,而cin以及cout则不需要.但是cin也有一些缺陷,比如 ...

  9. Linux—Ubuntu14.0.5安装gitlab

    1.下载gitlab-ce,到该连接选择版本   https://mirror.tuna.tsinghua.edu.cn/gitlab-ce/ubuntu/pool/trusty/main/g/git ...

  10. mysql 怎样先排序再分组

    权游游牧族:众所周知!一句SqL语句不能先排序再分组.所以这里给出几个案例 --表结构-- create table `shop` ( `id` int (10) PRIMARY KEY, `shop ...