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

 

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. Python 之 %s字符串、%d整型、%f浮点型

    %s string="hello" #%s打印时结果是hello print "string=%s" % string # output: string=hel ...

  2. php实现非对称加密

    <?php /** * 使用openssl实现非对称加密 * * @since 2015-11-10 */ class Rsa { /** * 私钥 * */ private $_privKey ...

  3. 分块编码(Transfer-Encoding: chunked)VS Content-length

    参考链接: HTTP 协议中的 Transfer-Encoding 分块传输编码 https://www.cnblogs.com/xuehaoyue/p/6639029.html 一.背景: 持续连接 ...

  4. C# 截取字符串基本

    #region --构建字符串处理 string str1 = "123AAA456AAAA789AAAAAAA1011"; string str2 = "1234567 ...

  5. 前端开发—HTML

    HTML介绍 web服务的本质 import socket sk = socket.socket() sk.bind(("127.0.0.1", 8080)) sk.listen( ...

  6. 原生js通过最外层id获取下面指定的子元素

    需求:在vue中使用v-for循环出来的元素,设置动态id,之后获取下面的所有textarea标签 template: <table cellpadding = 2 v-for="(i ...

  7. 数据挖掘系列 (1) 关联规则挖掘基本概念与 Aprior 算法

    转自:http://www.cnblogs.com/fengfenggirl/p/associate_apriori.html 数据挖掘系列 (1) 关联规则挖掘基本概念与 Aprior 算法 我计划 ...

  8. 高举 Vue-SSR

    将同一个组件渲染为服务器端的 HTML 字符串,将它们直接发送到浏览器,最后将静态标记"混合"为客户端上完全交互的应用程序. SSR的目的 To solve 首屏渲染问题 SEO问 ...

  9. 2019-04-02 cast and covert

    convert 专用于SQLServer,cast对于其它数据库的兼容性更好 convert 处理日期和时间值更厉害 语法不一样: cast(itemvalue as decimal(19,6)) c ...

  10. 学习EXTJS6(8)基本功能-表单的基础表字段Ext.form.field.Basic

    Ext.form.field.Basic是表单字段的基类. Ext.form.field.Text Ext.form.field.TextArea Ext.form.field.Number Ext. ...