JS
根据ID取元素,取到的是具体的元素
var a = document.getElementById("p1");
根据CLASS取
var a = document.getElementsByClassName("aa");
根据标签名取
var a = document.getElementsByTagName("div");
根据name取
var a = document.getElementsByName("cc");
alert(a);

操作元素
操作内容
非表单元素
a.innerText = "hello";
a.innerHTML = "<span style='color:red'>world</span>";
表单元素
a.value = "hello";
操作属性
a.setAttribute("bs","1");
a.getAttribute("bs");
a.removeAttribute("bs");
操作样式
a.style.color = red;

三个DIV隐藏
var a = document.getElementsByClassName("aa");

for(var i=0;i<a.length;i++)
{
a[i].style.display = "none";
}

事件


Jquery
根据ID找元素,取到的是JQUERY对象
var b = $("#a1");

根据CLASS取
var b = $(".aa");

根据标签名取
var b = $("div");

根据属性筛选
var b = $("[name=aa]");

操作元素
操作内容
非表单元素
b.text();
b.html();
表单元素
b.val();
操作属性
b.attr("bs","1");
b.attr("bs");
b.removeAttr("bs");
操作样式
alert(b.css("color"));
b.css("font-size","50px");

alert(b[0]); 取jquery对象用eq()取元素本身用[]

隐藏三个元素
$(".aa").css("display","none");


jq挂事件

<input type="text" id="p1" />
<input type="button" id="b1" value="挂事件" />
<input type="button" id="b2" value="移除事件" />
<script type="text/javascript">

Jquery【加】事件
页面加载完成
$(document).ready(function(e) {

给a1加点击
$("#a1").click(function(){
alert('aa');
})
给class为aa的所有元素加事件
$(".aa").click(function(){
alert($(this).attr("bs"));
$(".aa").css("background-color","#39F");
$(this).css("background-color","red");
})

第二种方式【挂】事件
$("#b1").click(function(){

$("#a1").bind("click",function(){

alert("我是挂上的事件");

});

})
$("#b2").click(function(){

$("#a1").unbind("click");
})

});

</script>

转载于:https://www.cnblogs.com/sq45711478/p/6042762.html

jquery 和js 还有 jq 挂事件相关推荐

  1. 初识 jquery.simulate.js 模拟键盘事件

    用jquery 和 jquery.simulate.js 实现模拟键盘事件,点击上下左右div相当于点击键盘的上下左右键 <!DOCTYPE html> <html><h ...

  2. day05【JQuery框架】HTML引入Jquery、jQuery与JS区别、基本选择器、层级关系选择器、属性选择器、过滤选择器、 对象遍历、Jquery的DOM操作【重点】、Jquery事件绑定

    回顾 1. bom对象window对象三种弹框alert()confirm()prompt()二种定时器一次性:setTimout() --- 通过递归实现循环性循环性:setInterval()lo ...

  3. html 鼠标右键点击事件,js与jq的鼠标右键点击事件

    一些网站会利用js脚本或jq脚本来阻击浏览器的右击菜单来展示自定义菜单,这篇博文不谈如何实现右击的自定义菜单(以后有时间会开个单篇来讲,因为涉及到鼠标的定位问题要说很多),这篇文章来说一下如何利用JQ ...

  4. js中的onclick事件和JQuery中的click方法以及on方法事件用法总结

    1.onclick是绑定的事件(它是一个事件),注意该事件绑定只是JacaScript中有(js中的),Jquery中并没有此事件,告诉浏览器在鼠标点击时候要做什么 2.click方法(jquery中 ...

  5. jquery.orgchart.js 简单demo,自定义内容,自定义事件

    orgchart简单demo GIT地址: https://github.com/Vlovely/orgchartDemo.git 预览图 代码示例 <!DOCTYPE html> < ...

  6. jq:jQuery库文件jquery.scrollLoading.js使用方法

    图片延迟加载,滚动到哪里加载到哪里: 1:头部加载库文件 <script type="text/javascript" src="/js/jquery.scroll ...

  7. JQuery dad js自定义删除和拖动回调事件

    一 .引入JQuery.dad.js,不要引入JQuery.dad.min.js.下载地址:GitHub - williammustaffa/jquery.dad.js: DAD: A simple ...

  8. javascript和jq的事件委托

    2019独角兽企业重金招聘Python工程师标准>>> 今天在公司,有个需求是,通过ajax动态查询数据,回来,再添加到一个ul的li元素中,例如(点击生成 li 模拟,加载数据生成 ...

  9. Jquery.LazyLoad.js修正版下载,实现图片延迟加载插件

    之前一直有关注过Jquery.LazyLoad.js这个特效,但一直没有用,这几天研究了一下,并应用于实际中,对网站SEO方面没有什么帮助,不过可以节省一些流量,对于大网站来说显的尤为重要,至于节省了 ...

最新文章

  1. 关于比特币,人民日报发话了!
  2. 【奇葩面试题】因为太难而被禁用的17道Google面试题
  3. MySQL innodb每行数据长度的限制
  4. python元组与列表的区别、简答题_细解python面试题(一)元组和列表的区别
  5. SSH软件包:Sftp,scp和ssh-agent
  6. 用hibernate类实现数据库的基本操作
  7. finetune代码实战讲解(李沐)
  8. 如何在JavaScript中使用apply(?),call(?)和bind(➰)方法
  9. ubuntu中提示找到make命令的解决方案
  10. java图片上传并解析,详解SpringMVC实现图片上传以及该注意的小细节
  11. EasyUI +MVC +EF实现增删改查
  12. python数字转换成中文大写_python中如何将货币数字转化成汉字大写金额
  13. Atitit 源码语句解析结构 目录 1.1. 栈帧(stack frame).每个独立的栈帧一般包括: 1 1.2. 局部变量表(Local Variable Table) 2 2. ref 2
  14. springboot前台页面写Java代码,接收后台数据,SpringBoot整合Thymeleaf的使用,实现非ajax请求后台的数据实现和遍历效果,以及数据的页面展示
  15. Bugzilla的安装和配置
  16. 机器人布里茨哪个皮肤好看_【图片】【全皮肤鉴赏系列】蒸汽机器人 布里茨【lol半价吧】_百度贴吧...
  17. 卷积神经网络的现代雏形——LeNet
  18. 苹果手机计算机的使用技巧,苹果手机6个使用小技巧,简单又实用,让你更好地了解你的iPhone...
  19. 入门者必备——fpga芯片速度等级认识
  20. 腾讯地图api-基本用法总结

热门文章

  1. 了解浏览器工作原理-初步
  2. 连接池--在密码修改的影响
  3. cpio/rpm2cpio 命令
  4. 基于SAAS的IT运维管理方案
  5. luoguP2479 [SDOI2010]捉迷藏
  6. Yii2与Yii1的模块中Layout使用区别
  7. OpenMediaVault Redmine 安装
  8. mysql-innodb 日志机制分析----写在死锁前面
  9. 【转】如何在github上fork一个项目来贡献代码以及同步原作者的修改 -- 不错
  10. 企业数据移动服务管理软件SAP