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

生成元素

$('<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;
});

转载于:https://www.cnblogs.com/2018/archive/2010/10/13/1849982.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值