jQuery属性和功能的基础应用 和js的部分比较

	// 网页中所有DOM结构绘制完成后执行,可能DOM元素关联的东西还没有加载
	/*$(document).ready(function() {
		alert("111");
	})*/
	// 等网页中所有内容都加载完才执行
	/*window.onload = function() {

	}*/

	//==========================================查找节点================================
	/*var a = document.getElementById("container");
	var b = $("#container");
	console.log("js====================");
	console.log(a);
	// js对象转jQuery对象
	console.log($(a));
	console.log("jquery====================");
	console.log(b);
	// jQuery对象转js对象
	console.log(b[0]);
	console.log(b.get(0));*/

	/*$("选择器");
	$("#id");//寻找id
	$(".class");//寻找class
	$("element");//寻找节点
	$("*");//全局定义
	$("a b");
	$("a>b");//选择子类节点
	$(".class:first");//第一个class
	$(".class:last");//最后一个class
	$(".class:first-child"); //选择父元素的第一个子元素
	$(".class:last-child"); //选择父元素的最后一个子元素
	$(".class:even");//偶数
	$(".class:odd");*/基数

	/*var x = $("a").eq(0);*/
	//==========================================创建节点================================

	/*var div = document.createElement("div");
	div.innerText("1");//js中创建节点

	var span = $("<span class='a'>1</span>");*/jq中创建节点
	//==========================================插入节点================================
	/*父元素.appendChild(子元素)
	父元素.insertBefore(要插入的元素,位置)
	var li = $("<li>4</li>");*/
	/*$("#ul").append(li);  //添加元素
	$("#ul").prepend(li);*/  插入的元素置前
	
	/*li.insertAfter($("li").eq(1));    //  在某个索引后添加元素
	insertBefore()*/      //    在某个索引前添加元素

	//==========================================删除节点================================
	/*$("li").eq(1).remove();
	$("li").eq(1).detach(); //从DOM中去掉所有匹配元素,但不会把匹配元素从jQuey对象中删除,因而可以在将来再使用这些匹配的元素
	$("li").eq(1).empty();*/    将所选元素置空

	//==========================================替换/复制节点================================
	/*$("#ul").append($("#li1").clone());    //复制即克隆
	$("#li1").replaceWith($("<li>5</li>"));*/    //替换


	//==========================================属性操作================================
	/*$("#a").attr("target"); //取值       //取属性
	$("#a").attr("target","_blank"); //赋值      赋予属性

	$("#a").removeAttr("href");*/      去除某个属性

	//==========================================样式操作================================
	/*$("#container").attr("class","red");*/     覆盖样式
	/*$("#container").addClass("red");         //添加样式
	$("#container").removeClass("red");*/        //移除样式
	/*$("#container").toggleClass("red");       //貌似是隐藏样式  
	$("#container").hasClass("red");*/       //显示拥有此样式

	/*$("#container").css("height","400px");*/

	//==========================================获取设置HTML、文本、值====================
	/*$("#container").html("<a>1</a>");      //与js中的innerHTML相同
	$("#container").text("<a>1</a>");
	$("input").val("xx");*/

	//==========================================遍历节点====================
	js中
	/*子节点.parentNode()
	父节点.children()                              //所有的子节点
	节点.previousElementSibling();         //所选节点的前一个
	节点.nextElementSibling();*/                //所选节点的后一个
    jq中
	/*子节点.parent()
	父节点.children()
	节点.prev()
	节点.next()*/

	//获取所有同辈元素
	// console.log($("#li1").siblings());
	//用于取得最近的匹配元素,首先检查当前元素是否匹配,匹配直接返回元素本身,否则逐级向上找
	// $("#li1").closet("ul");

	// 链式编程
	 // $("#id").eq(1).append().().().();
	 //==========================================事件绑定====================
	/*$("#container")[0].onclick = function() {
	 	alert("11");
	}*/
	/*$("#container").on/bind("click",function() {              //一般用on
		alert("111");
	})

	$("#id").on('事件类型',function() {

	})*/

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值