jquery （对内容，元素，属性，class的操作）
对内容的操作：
捕获：获得内容
text() - 设置或返回所选元素的文本内容
html() - 设置或返回所选元素的内容（包括 HTML 标记）
val() - 设置或返回表单字段的值。
设置：设置内容
添加新内容：
text("新内容") - 设置所选元素的文本内容
html("新内容") - 设置所选元素的内容（包括 HTML 标记）
val("新内容") - 设置表单字段的值
添加新内容的同时，通过回调函数，拿到旧的内容和当前元素的下标：
<body>
<p>baidu.com.cn</p>
<p>baidu.com.cn</p>
<p>baidu.com.cn</p>
<button>添加新内容</button>
</body>
</html>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").html(function(i,origValue){
//回调函数中i是当前被选元素的下标，origValue是原来的文本
return i+","+origValue + "/news";
});
});
});
</script>
对元素的操作：
添加元素：添加新的 HTML 内容
1.append() - 在被选元素的内部结尾插入内容
2.prepend() - 在被选元素的内部开头插入内容
3.after() - 在被选元素外部之后插入内容
4.before() - 在被选元素外部之前插入内容
删除元素：
1.remove() - 删除被选元素（及其子元素）
2.empty() - 从被选元素中删除其子元素
属性操作：
获取属性：attr() 方法用于获取属性值。
$("button").click(function(){
alert($("#runoob").attr("href"));
});
设置属性：
attr("属性名","属性值") 方法也用于设置属性值。
多个属性：
$("button").click(function(){
$("#runoob").attr({
"href" : "http://www.baidu.com",
"title" : "百度"
});
});
添加新属性的同时，通过回调函数，拿到旧的属性和当前元素的下边：
<body>
<p><a href="http://www.baidu.com.cn" class="baidu">baidu.com.cn</a></p>
<p><a href="http://www.baidu.com.cn" class="baidu">baidu.com.cn</a></p>
<p><a href="http://www.baidu.com.cn" class="baidu">baidu.com.cn</a></p>
<button>改变 href 值</button>
<p>请把鼠标指针移动到链接上，或者点击该链接，来查看已经改变的 href 值。</p>
</body>
</html>
<script>
$(document).ready(function(){
$("button").click(function(){
$(".baidu").html(function(i,origValue){
//回调函数中i是当前被选元素的下标，origValue是原来的文本
return i+","+origValue + "/images";
});
});
});
</script>
删除属性：removeAttr() 从所有匹配的元素中移除指定的属性。
class类的操作：
addClass() 向匹配的元素添加指定的类名。
hasClass() 检查匹配的元素是否拥有指定的类。 removeClass() 从所有匹配的元素中删除全部或者指定的类。
toggleClass() 从匹配的元素中添加或删除一个类。
jquery （对内容，元素，属性，class的操作）的更多相关文章
- JQuery处理DOM元素-属性操作
JQuery处理DOM元素-属性操作 //操作元素的属性: $('*').each(function(n){ this.id = this.tagName + n; }) //获取属性值: $('') ...
- jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解
jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解 jQuery中操纵元素属性的方法: attr(): 读或者写匹配元素的属性值. removeAttr(): 从匹配的 ...
- jQuery - 设置内容和属性 设置内容 - text()、html() 以及 val() , 设置属性 - attr()
jQuery - 设置内容和属性 设置内容 - text().html() 以及 val() text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTM ...
- jQuery - 获取内容和属性
jQuery 拥有可操作 HTML 元素和属性的强大方法. jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力. jQuery 提供一系列与 DOM 相关的方法,这使 ...
- jquery获取内容和属性的方法
通过jquery如何捕获文本内容和属性? text(),html(),val()及attr(). attr()更具有普遍性,元素text属性和表单value属性,可以通过attr()操作. <! ...
- jQuery - 获得内容和属性
jQuery 拥有可操作 HTML 元素和属性的强大方法. jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力. jQuery 提供一系列与 DOM 相关的方法,这使 ...
- <七> jQuery 设置内容和属性
设置内容 text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTML 标记) val() - 设置或返回表单字段的值 设置属性 jQuery attr( ...
- jQuery设置内容和属性方
何问起 hovertree.com 设置内容 - text().html() 以及 val()text() - 设置或返回所选元素的文本内容html() - 设置或返回所选元素的内容(包括 HTML ...
- jquery选择伪元素属性的方法
CSS伪元素不是DOM元素,因此你无法直接选择到它们 一个方法是为该元素添加新类,并通过设置新类的属性来达到改变伪元素属性的效果: .checkboxWrapper.selected::before{ ...
- <六> jQuery 获得内容和属性
获得内容 三个简单实用的用于 DOM 操作的 jQuery 方法: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTML 标记) val() - ...
随机推荐
- [笔记]IDEA使用笔记
1.IDEA的目录结构 2.所有的源文件都必须写在src文件夹下, 3.输入psvm再按回车,就会生成主函数: 4.输入sout就会生成输出语句的格式: 5.ALT+4 调出上次运行的结果出来看看 ...
- 关于laravel框架Model返回的值为stdClass对象转换两种方法
一般情况下laravel模型层查询出来的数据是stdClass对象,无法直接当做数组进行视图展示,所以需要转换为数组格式. Model中查到的数据为 $data ,对它进行转化,转化为数组. 第一 ...
- linux日常笔记（1）
1.SELlinux SELinux是 美国国家安全局 (NSA) 对于 强制访问控制的实现 =>可以使root受限的权限 关闭SELinux=>修改配置文件,永久生效; sed -i ' ...
- Serlvet之cookie和session学习
HTTP 协议 Web通信需要一种语言,就像中国人讲中文,欧美说英文,Web使用的HTTP协议,也叫超文本协议. 使用HTTP协议的人分为两类:客户端和服务端.请求资源的角色是客户端,提供资源的是服务 ...
- python：类5——Python 的类的下划线命名有什么不同？
首先是单下划线开头,这个被常用于模块中,在一个模块中以单下划线开头的变量和函数被默认当作内部函数,如果使用 from a_module import * 导入时,这部分变量和函数不会被导入.不过值得注 ...
- mysql基础之数据类型
一.整型 分为:tinyint .smallint .mediumint .int .bigint 常用的 分为以下三项: tinyint. smallint.int 数据类型 存储范围 字节 tin ...
- 0MQ讲述多线程魔法
为什么你想过的所有你所知道关于并发的事情,不是完全神经病的(Insane),就是假的(Bogus). 并发的定律,e=mc*c.这里并不是爱因斯坦的质能方程.而是 努力 = 代码规模 * (线程冲突碰 ...
- Blocked a frame with origin XXX from accessing a cross-origin 。iframe跨域问题
在前端开发的过程中,我们常常会用到iframe去在我们的页面中引用一个子页面,而父子页面又常常会有交互.在同域情况下,子页面如果想要访问父页面中的window对象中的方法的话,直接在当前页面中使用wi ...
- Openlayers ol.interaction.Select传值问题
说明: 在使用ol.interaction.Select时,我定义的变量作用域作用不到其回调函数里,但我在select结果中,需要用到这些变量 解决方案: 虽想了个办法解决了,但不知道是不是合理:是否 ...
- PostGIS 结合Openlayers以及Geoserver实现最短路径分析（二）
前文讲述了怎么用ArcMap制作了测试数据,并导入了PostGIS,接下来我们需要结合PgRouting插件,对入库的数据再进行一下处理. 1.在pgAdmin中,执行下面的sql语句 --添加起点字 ...