-
jQuery是一个类数组对象,而DOM是一个单独的DOM元素
var $div = $('div') //jQuery对象 var div = $div[0] //转化成DOM对象 div.style.color = 'red' //操作dom对象的属性
或者是用 var div = $div.get(0) 转化成DOM对象
查看全部 -
数组的索引是从0开始的,也就是第一个元素下标是0
查看全部 -
$(document).ready 的作用是等页面的文档(document)中的节点都加载完毕后,再执行后续的代码
查看全部 -
在http后添加s,p2的内容才显示出来
查看全部 -
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title></title>
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<!-- 使用JS原生语法 -->
<script type="text/javascript">
window.onload = function(){
// 通过原生JS语法获取id为imooc1的元素p
var p = document.getElementById('imooc1');
// 将元素p在html中内容改变
p.innerHTML = 'P1:您好!通过慕课网学习jQuery才是最佳的途径';
// 将元素p的内容颜色改为红色
p.style.color = 'red';
}
</script>
<!-- 使用jQuery语法 -->
<script type="text/javascript">
$(document).ready(function() {
/**
* 通过jQuery语法获取id为imooc2的元素获得一个jQuery对象
* 调用该对象的html()方法进行更改内容
* 调用该对象的css()方法进行更改颜色样式
*/
var $p = $('#imooc2');
$p.html('P2:您好!通过慕课网学习jQuery才是最佳的途径').css('color','red');
});
</script>
</head>
<body>
<p id="imooc1"></p>
<p id="imooc2"></p>
</body>
</html>
//在http后添加s,p2的内容才显示出来
查看全部 -
<script type="text/javascript">
function show (ele) {
if (ele instanceof jQuery) {
$("#show").html('元素的长度的 = ' + ele.length)
} else {
alert(ele +' 不是jQuery对象')
}
}
</script>
instanceof 判断是不是某个类型 类似与typeof
查看全部 -
//选取prev后面的第一个的div兄弟节点
$(".prev + div")
//选取prev后面的所有的div兄弟节点
$(".prev ~ div")
查看全部 -
<script type="text/javascript">
//获取页面中所有的元素
var elements1 = document.getElementsByTagName('*');
</script>
原生js方法
<script type="text/javascript">
//通过原生方法处理
//获取到所有的节点标记名为div的元素
//给每一个div加上蓝色的边框
var divs = document.getElementsByTagName('div');
for (var i = 0; i < divs.length; i++) {
divs[i].style.border = "3px solid blue";
}
</script>
查看全部 -
<script type="text/javascript">
//获取到指定元素的宽度,在回调返回宽度值
//通过处理这个value,重新设置新的宽度
$('.sixth').css("width",function(index,value){
var vb = value.split("px");
return(Number(vb[0] + 50) + vb[1];
})
</script>
.spllit()处理成数组
查看全部 -
jQuery.data( element, key, value ) //静态接口,存数据 jQuery.data( element, key ) //静态接口,取数据 .data( key, value ) //实例接口,存数据.data( key ) //实例接口,存数据
<script type="text/javascript">
$('.left').click(function() {
var ele = $(this);
//通过$.data方式设置数据
$.data(ele, "a", "data test")
$.data(ele, "b", {
name : "慕课网"
})
//通过$.data方式取出数据
var reset = $.data(ele, "a") + "</br>" + $.data(ele, "b").name
ele.find('span').append(reset)
})
</script>
<script type="text/javascript">
$('.right').click(function() {
var ele = $(this);
//通过.data方式设置数据
ele.data("a", "data test")
ele.data("b", {
name: "慕课网"
})
//通过.data方式取出数据
var reset = ele.data("a") + "</br>" + ele.data("b").name
ele.find('span').append(reset)
})
</script>
查看全部 -
jQuery是一个类数组对象,而DOM是一个单独的DOM元素
var $div = $('div') //jQuery对象 var div = $div[0] //转化成DOM对象 div.style.color = 'red' //操作dom对象的属性
或者是用 var div = $div.get(0) 转化成DOM对象
查看全部 -
$(document).ready 是等到页面加载完毕后执行的代码。用于依赖于页面的某一个元素,需要等到它加载完时使用
查看全部 -
js和jquery修改网页对象的方式是不同的
标准js是通过
var p = document.getElementById('imooc'); p.innerHTML = '您好!通过慕课网学习jQuery才是最佳的途径'; p.style.color = 'red';
而jquery是
var $p = $('#imooc'); $p.html('您好!通过慕课网学习jQuery才是最佳的途径').css('color','red');
查看全部 -
jquery优势就是可以让开发者更注重业务逻辑开发,而不需要我们具体知道哪个DOM节点有哪些方法,也不需要关心浏览器兼容性问题,我们通过jQuery提供的API进行开发,代码也会更加精短.
查看全部 -
这个出问题了
查看全部
举报