JQ 笔记

最新推荐文章于 2022-10-09 00:57:33 发布

MR-LHW

最新推荐文章于 2022-10-09 00:57:33 发布

阅读量87

点赞数 2

文章标签： jquery

本文链接：https://blog.csdn.net/L_virus/article/details/119825796

版权

文章目录

简介
绑定节点
获取父元素下的子元素
获取子元素的父元素
获取子元素的所有父元素
获取文本设置文本

简介

jQuery是一个快速、简洁的 JavaScript 框架，是继 Prototype之后又一个优秀的JavaScript代码库（框架）于2006年1月由 John Resig 发布。 jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。

为什么不能用下标来操作文本节点呢？？？？？？？？

绑定节点

console.log("-------绑定标签---------")
console.log("-------绑定ID---------")
console.log("-------绑定Class---------")
console.log("-------绑定属性---------")
/* 也可以绑定层级选择器 */

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>JQ获取对像</title>
		<style type="text/css">
			div{	
				width: 200px;
				margin: 10px auto;
				background-color: aqua;
			}
		</style>
	</head>
	<body>
			<div id="divID">
				<p class="pone">我是第一个DIV下的第一个p元素</p>
				<p class="pone">我是第一个DIV下的第二个p元素</p>
				<p>我是第一个DIV下的第三个p元素</p>
			</div>
		<div class="divClass" name="two">我是第二个div</div>
		<div class="divClass" name=two>我是第三个div</div>
		<div>我是第四个div</div>
		<script src="js/jquery-1.11.3.js" type="text/javascript"></script>
		<script src="js/JQ.js" type="text/javascript"></script>
	</body>
</html>

console.log("-------绑定标签---------")
	var div=$('div');
	console.log(div.length);
	//   这里只能用遍历 方法 不可以用下标  因为每个元素已经不是对象 
	div.each(function(){  
		console.log($(this).html());
})

console.log("-------绑定ID---------")
	/*  绑定  id  返回一个对像 */
	var divID=$("#divID");
	console.log(divID.html());

console.log("-------绑定Class---------")
	/* 绑定class */
	var divClass=$(".divClass");
	divClass.each(function(){
		console.log($(this).html());
		console.log($(this).text());
		console.log("-----------------")
	})

console.log("-------绑定属性---------")
/* 绑定属性 */
console.log("-------属性1---------")
var divAttr=$("[name=two]");   //返回的是数组
console.log(divAttr[0]);       // 利用下标的方法只能输出
console.log(divAttr[1]);       // divAttr[0].thml()  报错
console.log("-------属性2---------")
divAttr.each(function(){
	console.log($(this).html());	
})

获取父元素下的子元素

	console.log("-------根据父元素查找子元素方法1----------");
	 var divChild=$("#divID").children(".pone");  
	 divChild.each(function(){
	 console.log($(this).html());
	 console.log("-----------------");
  })

获取子元素的父元素

 var father=$(".pone").parent();	
 console.log(father);

获取子元素的所有父元素

 var fathers=$(".pone").parents();
	  console.log(fathers);
	  fathers.each(function(){
		  console.log( $(this).html());
		  console.log("------------")
  })

获取文本设置文本

.text() —》获取文本设置文本不包括标签
.html() —》获取文本设置文本包括标签
.var() —》获取表单文本
.arrt() —》获取属性设置属性对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。
prop() --》获取属性设置属性对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。

MR-LHW

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQ 笔记

文章目录简介绑定节点获取父元素下的子元素获取子元素的父元素获取子元素的所有父元素简介jQuery是一个快速、简洁的 JavaScript 框架，是继 Prototype之后又一个优秀的JavaScript代码库（框架）于2006年1月由 John Resig 发布。 jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。为什么不能用下标来操作文本节点呢？？？？？？？？绑定节点console.log("-------绑定标签--------
复制链接

扫一扫