jQuery使用总结 - Core jQuery Selectors选择器二3/4

简介: 生成元素 $('', { src: 'images/little.bear.png', alt: 'Little Bear', title:'I woof in your general direction', click: function(){ alert($(this).
生成元素

$('<img>',

{

src: 'images/little.bear.png',

alt: 'Little Bear',

title:'I woof in your general direction',

click: function(){

alert($(this).attr('title'));

}

})

.css({

cursor: 'pointer',

border: '1px solid black',

padding: '12px 12px 20px 12px',

backgroundColor: 'white'

})

.appendTo('body');

Element properties and attributes

$('*').attr('title',function(index,previousValue) {

return previousValue + ' I am element ' + index +

' and my name is ' + (this.id || 'unset');

});

This method will run through all elements on the page, modifying the title attribute of each element by appending a string (composed using the index of the element within the DOM and the id attribute of each specific element) to the previous value.

$('input').attr(

{ value: '', title: 'Please enter a value' }

);

$("a[href^='http://']").attr("target","_blank");

First, we select all links with an href attribute starting with http:// (which indicates that the reference is external). Then, we set their target attribute to _blank.

元素的class属性处理

<div class="someClass anotherClass yetAnotherClass"></div>

addClass removeClass toggleClass hasClass

元素的css属性处理

$("div.expandable").css("width",function(index, currentWidth) {

return currentWidth + 20;

});

.css({

cursor: 'pointer',

border: '1px solid black',

padding: '12px 12px 20px 12px',

backgroundColor: 'white'

})

元素上的自定义数据

$("div").data("blah"); // undefined

$("div").data("blah", "hello"); // blah设置为hello

$("div").data("blah"); // hello

$("div").data("blah", 86); // 设置为86

$("div").data("blah"); // 86

$("div").removeData("blah"); //移除blah

$("div").data("blah"); // undefined

元素的内容

var text = $('#theList').text();

函数:html text

文档处理

$("p").append("<b>Hello</b>");

$("p").wrap("<div class='wrap'></div>");

在“jQuery 1.4.1 Cheat Sheet.chm”文档处理节有例子

主要有:插入、替换、删除、包裹

Form元素处理

函数Val

$("#single").val("Single2");
$("#multiple").val(["Multiple2", "Multiple3"]);
$("input").val(["check2", "radio1"]);
$('input:text.items').val(function() {
  return this.value + ' ' + this.className;
});
相关文章
N..
|
25天前
|
JavaScript 前端开发 开发者
jQuery选择器
jQuery选择器
N..
14 1
|
3月前
|
JavaScript
jquery的9大选择器
jquery的9大选择器
26 2
|
29天前
|
JavaScript
jQuery选择器案例之——index.js
jQuery选择器案例之——index.js
8 0
|
29天前
|
JavaScript
jQuery选择器案例之——index.html
jQuery选择器案例之——index.html
9 1
|
29天前
|
JavaScript 前端开发
jQuery选择器整理
jQuery选择器整理
13 0
|
30天前
|
前端开发 JavaScript 索引
第二章jQuery选择器
第二章jQuery选择器
8 0
|
30天前
|
JavaScript
jquery选择器案例分享
jquery选择器案例分享
9 0
|
1月前
|
JavaScript 索引
jQuery选择器 获取元素的十一种方式
jQuery选择器 获取元素的十一种方式
|
2月前
|
JavaScript 前端开发 数据格式
2022年11月23日——jQuery——T1(基础选择器与表单选择器)
2022年11月23日——jQuery——T1(基础选择器与表单选择器)
44 0
|
3月前
|
JavaScript 前端开发 UED
简约优雅的 jQuery 选择器
简约优雅的 jQuery 选择器
18 0