.data(key,value)
存储与匹配元素关联的任意数据
this.$el.data("model", this.model);
("ul li:first-child") 返回 john glen。 查找每个ul下第一个元素是li元素dom元素。
http://www.jb51.net/article/97772.htm
animate()
语法:$(selector).animate(styles,speed,easing,callback)
styles:必需。规定产生动画效果的 CSS 样式和值。
speed:可选。规定动画的速度。默认是 "normal"。
easing:可选。规定在不同的动画点中设置动画速度的 easing 函数。
callback:可选。animate 函数执行完之后,要执行的函数。
animate() 方法执行 CSS 属性集的自定义动画
- 只有数字值可创建动画(比如 "margin:30px")。字符串值无法创建动画(比如 "background-color:red")
- 使用 "+=" 或 "-=" 来创建相对动画
$('#id') .css({marginLeft: this.$el.css('marginLeft')})
.animate({marginLeft: '+=2em'});
attr和prop区别
•对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
•对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
1.添加属性名称该属性就会生效应该使用prop();
2.是有true,false两个属性使用prop();
3.其他则使用attr();
注:使用prop方法获取属性则统一返回true和false
camelCase
camelCase函数的功能就是将形如background-color转化为驼峰表示法:backgroundColo
toggle-target data-toggle="collapse"
nextUntil()
功能描述:查找跟随某元素的同胞元素
举例:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
</head>
<body>
<dl>
<dt id="term-1">term 1</dt>
<dd>definition 1-a</dd>
<dd>definition 1-b</dd>
<dd>definition 1-c</dd>
<dd>definition 1-d</dd>
<dt id="term-2">term 2</dt>
<dd>definition 2-a</dd>
<dd>definition 2-b</dd>
<dd>definition 2-c</dd>
<dt id="term-3">term 3</dt>
<dd>definition 3-a</dd>
<dd>definition 3-b</dd>
</dl>
<script>
$("#term-2").nextUntil("dt").css("background-color", "red");
var term3 = document.getElementById("term-3");
$("#term-1").nextUntil(term3, "dd").css("color", "blue");
</script>
</body>
</html>
div中显示后端传过来的图片
//要使用div标签(不能使用textarea标签)
<div id="description" name="description" class="description-text" ></div>
// 初始化 描述
initDescription: function (model, content) {
//方法②: 将描述内容的html标签转义,优点:保留了空格、回车等格式、且图片有显示
var html = model.get('description');
$('#description').html(html);
},
//可使用textarea标签
//方法①: 将描述内容的html标签转义,缺点:没有保留空格、回车,图片没有显示
var $textarea = content.$('textarea[name=description]');
var html = model.get('description');
$textarea.val($(html).text());
$textarea.val(html);
width()、innerWidth()、outerWidth()
1 $el.width() = width;
2 $el.innerWidth() = width + padding;
3 $el.outerWidth() = width + padding + border
4 $el.outerWidth(true) = width + padding + border + margin(为true时包含[margin]);