//找元素

1.根据id找

<div id="d1" cs="ceshi"><span>document对象</span></div>

//var d1 = document.getElementById("d1");
//alert(d1);

2.根据class找

<div class="d">111</div>

<span class="d">222</span>

//var d2 = document.getElementsByClassName("d");
//alert(d2[1]); //d2[] 框中是想要显示的索引号，d2[0]就是显示的div，d2[1]就是显示的span

3.根据标签名找

//var d3 = document.getElementsByTagName("div");
//alert(d3[0]);

4.根据name找

<input type="text" name="aa" id="b1" value="biaodan" />

<input type="text" name="aa" />

//var d4 = document.getElementsByName("aa");
//alert(d4[0]); ////d4[] 和上面的d2一样

//操作元素：操作内容、操作属性、操作样式

<style type="text/css">
#d3{ color:red}
</style>

<body>

<div id="d1" cs="ceshi"><span>document对象</span></div>

<div class="d">111</div>
<span class="d">222</span>

<input type="text" name="aa" id="b1" value="biaodan" />
<input type="text" name="aa" />

<div id="d3" style="width:100px; height:100px; background-color:#636">111</div>

<input type="button" value="获取" onclick="showa()" />
<input type="button" value="设置" onclick="set()" />

</body>

1.操作内容：非表单元素、表单元素
非表单元素
//var d1 = document.getElementById("d1");
//1.获取文本
//alert(d1.innerText);
//2.设置文本
//d1.innerText = "hello";
//3.获取html代码
//alert(d1.innerHTML);
//4.设置html代码
//d1.innerHTML = "<b>加粗文字</b>";

表单元素
//var b1 = document.getElementById("b1");
//1.赋值
//b1.value = "ceshi";
//2.获取值
//alert(b1.value);

2.操作属性
//1.添加属性
//var d1 = document.getElementById("d1");
//d1.setAttribute("bs","1");
//2.获取属性
//alert(d1.getAttribute("cs"));
//3.移除属性
//d1.removeAttribute("cs");

3.操作样式
function showa()
{
//1.获取样式,只能获取内联样式
var d3 = document.getElementById("d3");
alert(d3.style.color);
}
function set()
{
var d3 = document.getElementById("d3");
//2.设置样式
d3.style.backgroundColor = "red";
}

document对象操作：浏览器页面文件的更多相关文章

  1. javascript获取iframe框架中页面document对象,获取子页面里面的内容,iframe获取父页面的元素,

    javascript获取iframe框架中,加载的页面document对象 因为浏览器安全限制,对跨域访问的页面,其document对象无法读取.设置属性 function getDocument(i ...

  2. 使用document对象操作cookie

    1. 使用document对象的cookie属性,可以让你读取.添加和更新文档(当期HTML)所关联的cookie. 2. 当你读取document.cookie时,会得到当期文档的所有cookie. ...

  3. Document对象操作、样式、属性、效果、

    Windows对象主要是操作浏览器外层的东西,而DOM对象是操作浏览器里面的东西. 如果我们要操作网页内容,那么一定需要操作标签! Document:文档对象模型→DOM:可以做一些特效(抢票的).摘 ...

  4. JS中基本window.document对象操作以及常用事件！

    一.找到元素 1.document.getELementById("id"):根据id找,最多找一个. var a=document.getELementById("id ...

  5. document对象-操作元素的文档结构

    1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="U ...

  6. 『心善渊』Selenium3.0基础 — 18、使用Selenium操作浏览器的弹窗

    目录 1.操作浏览器自带弹窗 2.操作浏览器页面自定义弹窗 1.操作浏览器自带弹窗 (1)说明: webdriver中处理JavaScript所生成的alert.confirm 以及prompt 弹窗 ...

  7. html5之history对象 控制浏览器前进或后退事件

    一.摘要: 总结用history对象操作浏览器的历史记录的方法,在项目中使用的是mui框架,总结中包括我在实际项目中遇到的问题. 二.总结: 实现效果: 实现代码: 上面的编辑页面加载的时候就要先调用 ...

  8. HTML DOM Document 对象

    HTML DOM Document 对象 HTML DOM 节点 在 HTML DOM (Document Object Model) 中 , 每一个元素都是 节点: 文档是一个文档. 所有的HTML ...

  9. Python3+Selenium2完整的自动化测试实现之旅（四）：Selenium-webdriver操作浏览器、Cookie、鼠标键盘、警示框、设置等待时间、多窗口切换

    本篇学习总结webdriver模块操作浏览器.Cookie.鼠标键盘.警示框.设置等待时间.多窗口切换等方法的使用 1    浏览器控制 Selenium-webdriverAPI提供了对页面元素定位 ...

随机推荐

  1. Android 中的 WebView实现 Html5 标签网页加载

    自Android 4.4起,Android中的WebView开始基于Chromium(谷歌浏览器)支持浏览器的一系列功能,webkit解析网页各个节点,这个改变,使得WebView的性能大幅度提升,并 ...

  2. iOS真机调试问题-App installation failed，The maximum number of apps for free development profiles has been reached.

    The maximum number of apps for free development profiles has been reached. 源引:http://www.jianshu.com ...

  3. Nginx-->进阶-->原理-->Nginx+php+fastcgi的原理与关系

    一.用户对动态PHP网页访问过程 用户浏览器发起对网页的访问:http://192.168.1.103/index.php 用户和nginx服务器进行三次握手进行TCP连接(忽略包括nginx访问控制 ...

  4. const in C++

    const关键字是C++中常用的类型修饰符,用法非常灵活,使用const将大大改善程序的健壮性. const的作用 1.  定义const常量: 比如: const int Max = 100; 2. ...

  5. 小甲鱼python视频第八讲（课后习题）

    1.for循环的使用,注意下面代码的区别 for i in range(0,10,2): print("i love you") for i in range(0,10): pri ...

  6. asp.net 去掉重复的querystring

    string[] vs = HttpContext.Current.Request.QueryString.GetValues(key);                    if (vs.Leng ...

  7. pdflatex, xelatex, texstudio中文编码问题

    使用xelatex,源文件需要用utf-8编译,pdf文件不会乱码. 使用pdflatex,源文件不能使用utf-8编码,否则pdf文件会乱码. 使用GB2312没问题.

  8. DOM、JDOM、DOM4J的区别(转载)

    DOM.JDOM.DOM4J的区别 分类: XML2012-06-11 20:47 5576人阅读 评论(6) 收藏 举报 文档xmlcollectionsjavaapi工作 dom是解析xml的底层 ...

  9. 如何进行正确的SQL性能优化

    在SQL查询中,为了提高查询的效率,我们常常采取一些措施对查询语句进行SQL性能优化.本文我们总结了一些优化措施,接下来我们就一一介绍. 1.查询的模糊匹配 尽量避免在一个复杂查询里面使用 LIKE ...

  10. 【转】virtualenv -- python虚拟沙盒

    有人说:virtualenv.fabric 和 pip 是 pythoneer 的三大神器. 不管认不认同,至少要先认识一下,pip现在倒是经常用到,virtualenv第一次听说,不过,总得尝试一下 ...