jquery 和js 还有 jq 挂事件

最新推荐文章于 2024-07-14 03:40:57 发布

转载最新推荐文章于 2024-07-14 03:40:57 发布 · 73 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/sq45711478/p/6042762.html

本文介绍了使用JavaScript和JQuery进行网页元素选择、操作的方法，包括根据ID、类名、标签名等方式选取元素，并展示了如何修改元素的内容、属性及样式等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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挂事件

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