jquery第四期：对象转换的小实例
为了更清晰的看懂jquery对象是一个数组，我们这一期来改变每一个<li>中的值，在前面加上序号。
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-1.10.1.js"></script>
<script type="text/javascript">
$(function()
{
var lis = $("#hello ul li");//获得jquery对象
for(i=0;i<lis.length;i++)
{
var li = lis[i];//获得js对象
li.innerHTML = "["+(i+1)+"]"+li.innerHTML;//调用js对象的innerHTML方法
}
});
</script>
</head>
<body>
<div id="hello">
<ul>
<li>niujiabin</li>
<li class="abc">maybe</li>
<li>gossipgo</li>
</ul>
</div> </body>
</html>
我们还可写成下面的形式：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-1.10.1.js"></script>
<script type="text/javascript">
$(function()
{
var lis = $("#hello ul li");//获得jquery对象
for(i=0;i<lis.length;i++)
{
var li = lis[i];//获得js对象
$(li).html("["+(i+1)+"]"+$(li).html());//html方法，可以改变文本值，若里面有参数是改变，
没参数是取值
}
});
</script>
</head>
<body>
<div id="hello">
<ul>
<li>niujiabin</li>
<li class="abc">maybe</li>
<li>gossipgo</li>
</ul>
</div> </body>
</html>
jquery第四期：对象转换的小实例的更多相关文章
- jQuery --- 第四期 (jQuery动效)
学习笔记 1.jQuery动画的淡入淡出 <!doctype html> <html> <head> <meta charset="utf-8&qu ...
- 第三章 JQuery: HelloWorld--常见方法--css--选择器--筛选器--属性--效果--事件--数组操作--字符串操作--对象转换
1.jQuery简介 为了简化JavaScript 的开发, 一些JavsScript 库诞生了. JavaScript库封装了很多预定义的对象和实用函数.能帮助使用者建立有高难度交互的页面, 并且兼 ...
- jquery json对象转换
jquery json对象转换 <pre>//json数组转json串var arr = [1,2,3, { a : 1 } ];JSON.stringify( arr ); //json ...
- 前端（十七）—— jQuery基础：jQuery的基本使用、JQ功能概括、JS对象与JQ对象转换、Ajax简单应用、轮播图
jQuery的基本使用.JQ功能概括.JS对象与JQ对象转换.Ajax简单应用.轮播图 一.认识jQuery 1.什么是jQuery jQuery是对原生JavaScript二次封装的工具函数集合 j ...
- jquery 和 js 对象转换
核心提示:jquery选择器得到的jquery对象和标准的 javascript中的document.getElementById()取得的dom对象是两种不同的对象类型,一般情况下,如S(’#id’ ...
- jquery第三期：js与jquery对象转换
我们开始进入jquery的学习了,jquery的学习就不那么中规中矩了,我们来看一个和javascript有所区别的地方. <!DOCTYPE html PUBLIC "-//W3C/ ...
- 22-[jQuery]-选择器, js jQuery对象转换
1.基础选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- jquery对象和javascript的dom对象转换
Jquery框架为jquery对象定义了独立使用的方法和属性,它无法直接调用dom对象的方法,dom对象也无法直接调用jquery对象的方法和属性. Jquery对象和dom对象是可以相互转换的,因为 ...
- jquery对象和DOM对象转换
DOM对象转换成jquery对象 var box = document.getElementById('box'); console.log($(box)); jquery对象转化成DOM对象 第一种 ...
随机推荐
- Serv-U无法连接到服务器127.0.0.1，端口43958 FTP服务器不能启动
端口43958,这是Serv-U的本地管理端口,只允许127.0.0.1连接. 在出现“Serv-U无法连接到服务器127.0.0.1,端口43958”这个错误的时候,一般ftp软件无法自动启动 ...
- poj 2531 Network Saboteur（经典dfs）
题目大意:有n个点,把这些点分别放到两个集合里,在两个集合的每个点之间都会有权值,求可能形成的最大权值. 思路:1.把这两个集合标记为0和1,先默认所有点都在集合0里. 2 ...
- IOS开发(objective-c)~开篇有理
自从6月份买了iphone5之后,心里都是觉得不学点IOS开发,始终觉得有点浪费,而且咱还学习C,C++,java,C#,有了这些基础,再不学这个Objective-c确实有点可惜了,所以,说干就干, ...
- 数据结构 B树、B-树、B+树、B*概念
B树 即二叉搜索树: 1.所有非叶子结点至多拥有两个儿子(Left和Right): 2.所有结点存储一个关键字: 3.非叶子结点的左指针指向小于其关键字的子树,右指针指向大于其关键字的子树: 如: B ...
- sulime运行 java 和 php
执行php脚本 1. 先配置好php环境变量 2. Tools -> Build System -> New Build System.... { "cmd" ...
- java整体集合框架
1.关于集合的两道面试题 先来看几道题目: 1.创建一个不可变的的集合: public static void main(String[] args) { Set<String> set ...
- java web每天定时执行任务（四步轻松搞定）
第一步: package com.eh.util; import java.util.Calendar; import java.util.Date; import java.util.Timer; ...
- 解决HTML5中placeholder属性兼容性的JQuery插件
//调用方法 $(function () { $(".pHolder").jason(); }); //HTML代码 <input type="text&quo ...
- javascript 数据结构和算法读书笔记 > 第五章 队列
队列是一种列表,但是它只能够在队尾插入元素,在队首删除元素.队列用于存储按照顺序排列的数据,先进先出.而栈则是后入栈的元素反而被优先处理. 实际中一般被应用在进程池.排队操作上面. 1. 队列的操作 ...
- Python : 熟悉又陌生的字符编码（转自Python 开发者）
Python : 熟悉又陌生的字符编码 字符编码是计算机编程中不可回避的问题,不管你用 Python2 还是 Python3,亦或是 C++, Java 等,我都觉得非常有必要厘清计算机中的字符编码概 ...