一、获取对象
//js获取的是dom对象,jquery获取的是jquery对象
//jquery对象可以输出dom对象,索引方式输出dom对象,eq()[]方式输出dom对象;eq()输出jquery对象;
//注意:通过id获取到的是一个对象,通过其他三种方式获取到的是一个数组
1、通过id获取元素
/*var div=document.getElementById("one");
alert(div);//获取到的是一个html元素[object htmldivelement],DOM对象 var div=$("#one");
//alert(div);//获取到的是一个对象[object Object],jquery对象
alert(div[0]);//[object htmldivelement]
alert(div.eq(0)[0]);//[object hemldivelement]*/ 2、通过class获取元素
/*var div=document.getElementsByClassName("two");
alert(div);//js获取到的是数组[object collection],取值用下标 var div=$(".two");
alert(div);//[object Object],里面装的是数组,3个div元素;
alert(div[0]);//索引取出的是DOM对象;
alert(div.eq(2)[0]);//这样取出的是DOM对象;*/ 3、通过name获取元素
var bd=document.getElementsByName("uid");
alert(bd[0]);
//通过属性获取元素;
var bd=$("[name='uid']");
var bd=$("[bs='aa']");
alert(bd[0]);*/ 4、通过标签名获取元素
/*var a=document.getElementsByTagName("div")
alert(a[0]);
var b=$("div");
alert(b[0]);*/ 5、组合选取
/*var c=$("div span");//空格选取后代
alert(c[0]);*/
//操作对象
//1、操作内容
//非表单元素
//js:
//取值:
/*var t=document.getElementById("one");
alert(t.innerText);
alert(t.innerHTML);
//赋值
t.innerText="aaa";
t.innerHTML="<h1>反反复复</h1>"; var ar=document.getElementsByClassName("two");
ar[0].innerText="s";
alert(ar[0].innerText);*/ //jquery赋值取值:通过$("#one")方式获取到jquery对象,把text内容或是html元素扔进去,相应的页面显示文本内容或是html标签;
/*var a=$("#one");
a.text("面积");
alert(a.text());
a.html("<input type='text' />");
alert(a.html());*/ //表单元素
//js
//var t=document.getElementById("uid");
//t.value="asdas";
//alert(t.value)
//jquery
/*var t=$("#uid");
t.val("就喝喝酒");
alert(t.val());*/
//2、操作属性
//js
/*var d=document.getElementById("one");
d.setAttribute("","");
d.removeAttribute("");
d.getAttribute("");*/
//jquery
//var d=$("#one");
/*d.attr("test","很后悔");//创建
d.removeAttr("test");//去除
d.attr("id");//获取*/
//3、操作样式
//js
/*var d=document.getElementById("one");
d.style.backgroundColor="red";
alert(d.style.color);//只能获取内联样式*/
//jquery
/*var a=$("#one");
a.css("background-color","yellow");
alert(a.css("color"));*/
//4、操作元素
/*var m=$("#one");
var r="<div style='width:100px;height:100px;background-color:red' id='s'>事实上事实上</div>";
m.append(r);//追加元素
$("#s").remove();//移除某个元素*/
//事件
//点击事件
/*$(".two").click(function(){
alert($(this).text());
})*/
/*$(".two").click(function(){
alert($(this).text());
})*/
//点一次弹两次
//绑定
$(".two").bind("click",function(){
alert($(this).text());
});
//解绑
$("#q").click(function(){
$(".two").unbind("click");
});
//添加绑定按钮,点多次按钮点一下出现多次效果
$("#qq").click(function(){
$(".two").bind("click",function(){
alert("aa");
});
})

js/jquery 操作document对象的更多相关文章

  1. JS操作document对象

    找到对象: document.getElementById():返回对拥有指定 id 的第一个对象的引用. document.getElementsByName():返回带有指定名称的对象集合. do ...

  2. selenium3 + python - js&jquery操作处理

    # 推荐学习:https://www.w3school.com.cn/js/index.asp## 下面以简书登录&注册定位元素为例"""js定位 id name ...

  3. JS注入操作页面对象

    在用selenium webdriver 编写web页面的自动化测试代码时,有时对页面对象的操作需要通过js语句去执行,selenium本身就支持执行js,我们在代码中import org.openq ...

  4. JS中window.document对象

    小知识点注:外面双引号,里面的双引号改为单引号:                  在div里面行高设置和整个外面高度一样,才能用竖直居中,居中是行居中                  文本框取出来 ...

  5. 【转载】使用Jquery操作Cookie对象

    Cookies是一种能够让网站服务器把少量数据储存到客户端的硬盘或内存,或是从客户端的硬盘读取数据的一种技术.jQuery是一个封装好的JavaScript库,使用jQuery可以极大地简化了Java ...

  6. jQuery操作元素对象的样式

    在jQuery中操作元素为了加快速度,或者书写速度,可以用到json的格式: <!DOCTYPE html> <html> <head> <meta char ...

  7. js,jquery遍历数组,对象

    each的用法  1.数组中的each 复制代码 var arr = [ "one", "two", "three", "four ...

  8. JS/Jquery遍历JSON对象、JSON数组、JSON数组字符串、JSON对象字符串

    JS遍历JSON对象 JS遍历JSON对象 <script> var obj = { "goodsid": "01001", "goods ...

  9. 强强联合之jquery操作angularjs对象

    jquery是一个非常强大的js框架,angularjs是一个非常牛的前端mvc框架.虽然用其中的任何一个框架在项目中够用了,但是有时候这两个框架需要混合着用,虽然不推荐.但有时候混合用时,却非常方便 ...

随机推荐

  1. 重学STM32----(一)

    在这学习stm32半年的时间中,虽然明显的感觉到自己在进步,但是还是发现学习方法的错误.由于急功近利的性格,在学习stm32之初,我选择了最简单的办法,用库函数来写程序,而且也由于我这急功近利的性格, ...

  2. Inherits、CodeFile、CodeBehind的区别

    Inherits.CodeFile.CodeBehind 在 ASP.NET 中使用代码隐藏方法来设计Web 窗体,可使页代码能够更清晰地从 HTML 内容中分离到完全单独的文件中. 通常一个 @pa ...

  3. 'dict' object has no attribute 'a'

    a = {} #a.a = 'a' #AttributeError: 'dict' object has no attribute 'a' #a['a'] #KeyError: 'a' a['a'] ...

  4. dede的pagelist标签的listsize数字属性详解(借鉴)

    dede的pagelist标签的listsize数字属性详解.见远seo经常用织梦搭建各种网站,有次发现列表页面的分页显示超过div的界限,也就是溢出了或者说是撑破了.后来经过研究发现是pagelis ...

  5. 双系统安装要点 - imsoft.cnblogs

    1.用磁盘工具  取消当前激活分区,并隐藏当前激活分区2.按照普通的形式安装系统  Ghost安装和简单安装都可以3用修复启动项工具  修复之前处隐藏的系统启动项 OK,再就不会看到烦人的蓝屏了!

  6. 矩阵基本运算的 Python 实现

    from...import与import区别在于import直接导入指定的库,而from....import则是从指定的库中导入指定的模块 import...as则是将import A as B,给予 ...

  7. SQLite 字段类型

    一般数据采用的固定的静态数据类型,而SQLite采用的是动态数据类型,会根据存入值自动判断. SQLite具有以下五种数据类型: 1.NULL:空值. 2.INTEGER:带符号的整型,具体取决有存入 ...

  8. SQL根据现有表新建一张表

    SQL根据现有表新建表,新建的这张表结构要跟现有表结构相同,但不要现有表里面的数据! 执行DML语句依据数据库类型而定: SQLITE -----复制表结构及数据到新表 CREATE TABLE TA ...

  9. tulterbot遥感操作使用Interactive Markers--12

    原创博客:转载请表明出处:http://www.cnblogs.com/zxouxuewei/ 1.安装ros indigo功能包: sudo apt-get install ros-indigo-t ...

  10. Codeforces Round #130 (Div. 2)

    A. Dubstep 字符串模拟. string.find()用法 string str; size_t pos = str.find("WUB"); // 返回匹配的第一个位置 ...