手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >JQuery魔力之$("tagName")与selector
JQuery魔力之$("tagName")与selector
摘要:JQuery魔力(一)$("tagName")DOM中的getElementsByTagName()方法在JQuery中的表现就是$("ta...

JQuery魔力(一)$("tagName")

DOM 中的 getElementsByTagName()方法在JQuery中的表现就是$("tagName")这么简单!

匿名函数来解决 window.onload 事件

对页面上的所有"div"标记下手,定义统一的外观

对"body"标记定义外观

动态添加一个"span"标记将其放置在"body"里

复制代码 代码如下:

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>JQuery 测试</title>

<script src="js/jquery-1.7.1.min.js" type="text/javascript">

</script>

<script type='text/javascript'>

$(function () {

$("div").width(100)

.css("color", "red")

.css("margin", "20px")

.css("border", "dotted 1px green");

$(document.body).css("background-color", "#cccccc");

$("<span>Four</span>").appendTo("body");

});

</script>

<script type="text/javascript">

$(function () {

var v = $("div");

alert(v.length);

for (var i = 0; i < v.length; i++) {

alert(v[i].innerHTML);

}

});

</script>

</head>

<body>

<div>

第一个div</div>

<div>

第二个div</div>

<div>

第三个div</div>

</body>

</html>

JQuery魔力(二) selector

tag标签(可以是:p、div、button …)标签本身具有ID、Class等属性

复制代码 代码如下:

$("tag") //取得页面中的某种标签的集合 同 document.getElementsByTagName("tag")

$("#id") //据id取得页面中的元素 同 document.getElementById("id")

$("tag#id") //据id取得标签为tag元素集合

$(".class") //据class取得元素集合 同 document.getElementsByClassName("class")

$("tag.class") //据class取得标签为tag的元素集合

$("tag1 tag2") //取得tag1内的tag2类型元素 同

$("tag1 > tag2")

$("tag1:has(tag2)") //取得包含tag2的tag1类型的元素集合

上面的selector充分体现了JQuery存在的价值,就是语法简洁且语义容易理解。

【JQuery魔力之$("tagName")与selector】相关文章:

JavaScript检测鼠标移动方向的方法

jQuery实现首页图片淡入淡出效果的方法

JavaScript中的Math.SQRT1_2属性使用简介

网页中移动的广告效果 鼠标悬停

JavaScript中用sort()方法对数组元素进行排序的操作

AngularJS学习笔记之ng-options指令

javascript实现图片跟随鼠标移动效果的方法

js+html5操作sqlite数据库的方法

JavaScript静态的动态

jQuery插件jRumble实现网页元素抖动

精品推荐
分类导航