属性的操作包括：读和写

方法：

　　1）”.“操作

　　2）”[ ]“操作

eg：

var oDiv = document.getElementById('div1');

var attr = 'color';

//这里的attr是变量，使用时要用[attr]，而不是.attr

oDiv.style[attr] = 'red';

属性写法：

　　1）html属性和js属性写法相同。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script type="text/javascript">

        // 这个函数的作用是：当整个文档加载完成之后，再执行{}中的内容

        window.onload = function () {

            var oA = document.getElementById('link1');

            //“写”操作

            document.getElementById('div1').title = '我看到了！';

            oA.href = 'http://www.baidu.com';

            oA.title = '去百度网';

            //“读”操作

            alert(oA.id)

        }

    </script>

</head>

<body>

    <div id="div1" class="div1" style="color:red" title="div元素,你看到了吗">

        这是div元素

    </div>

    <a href="#" id="link1">百度</a>

</body>

</html>

　　2）”class“属性写成”className“，因为class在js中是一个关键字。

　　3）”style“属性里面的属性，font-size这种带-的，要变为fontSize

　　innerHTML:

　　通过innerHTML可以读写元素包括的内容。eg：alert（oDiv.innerHTML）;oDiv2.innerHTML = "<a href="http://www.baidu.com">百度</a>"

JS——操作元素属性的更多相关文章

  1. vue.js操作元素属性

    vue动态操作div的class 看代码: <!doctype html> <html lang="en"> <head> <meta c ...

  2. 3 、操作元素 (属性 CSS 和 文档处理)

    3   操作元素-属性 CSS 和 文档处理  3.1 属性操作 $("p").text()    $("p").html()   $(":check ...

  3. 003——VUE操作元素属性

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. 使用jQuery操作元素属性

    在jQuery中,提供了attr函数来操作元素属性,具体如下: 函数名 说明 例子 attr(name) 取得第一个匹配元素的属性值. $("input").attr(" ...

  5. JS获取元素属性和自定义属性

    获取元素的属性分为两种类型: 1-获取元素常见的属性(class,id,type,value……) 2-获取自定义的元素的属性(data-value,data-mess…….) 获取元素的属性,设置元 ...

  6. Javascript操作元素属性方法总结

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  7. javascript 操作元素属性的方法

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  8. dom操作------操作元素属性的若干方法

    // 1,通过HTMLElement类型的属性来获得和设置元素特性(设置的是元素属性,比如class,id,title,而不是css样式,比如float,border等)let div = docum ...

  9. js操作元素导致元素错位和大小改变

    使用js循环的方式批量控制元素的大小时结果往往不尽如人意. 我总结了一条规律 在一个循环体内不可以同时存在一下两种操作,否则容易导致元素错位或大小改变: 1.对元素的offsetWidth.offse ...

随机推荐

  1. POJ1456：Supermarket

    浅谈堆:https://www.cnblogs.com/AKMer/p/10284629.html 题目传送门:http://poj.org/problem?id=1456 把物品按照时间排序,显然\ ...

  2. CCS V5 使用教程二：创建工程和配置软件仿真

    新建CCS项目 选择File/New/CCS Project: 新建项目对话框 1)        Project name: 指项目名称,这里要注意的项目名称不区分大小写. 2)        Ou ...

  3. MongoDB分析工具之一：explain()语句分析工具

    explain(),语句分析工具 MongoDB 3.0之后,explain的返回与使用方法与之前版本有了很大的变化,介于3.0之后的优秀特色和我们目前所使用给的是3.0.7版本,本文仅针对Mongo ...

  4. window下rails4.1 发生TZInfo::DataSourceNotFound 错误 - smallbottle

    在官网上学习rails 4.1 ,启动rails server之后发生了如下错误 $ rails server Booting WEBrick Rails 4.1.0 application star ...

  5. js开发：数组的push()、pop()、shift()和unshift()（转）

    js开发:数组的push().pop().shift()和unshift() 2017-05-18 11:49 1534人阅读 评论(0) 收藏 举报  分类: javascript开发(22)  版 ...

  6. [原创]SQL表值函数:返回从当前周开始往回的自定义周数

    一如往常一样,一篇简短博文记录开发过程中遇到的一个问题.初衷都是记录自己的一些Idea,也是希望能够帮助一些凑巧遇到此类需求的问题,这个需求的的开端是因为,要统计最近N周的销售数据. 接下来我们来看看 ...

  7. netty+mqtt

    package io.mqtt.server; import io.mqtt.tool.ConfigService;import io.netty.bootstrap.ServerBootstrap; ...

  8. Spring入门第二十八课

    事务的传播行为 当事务方法被另一个事务方法调用时,必须指定事务应该如何传播,例如:方法可能继续在现有事务中运行,也可能开启一个新的事务,并在自己的事务中运行. 事务的传播行为可以由传播属性指定.Spr ...

  9. swiper实现左右滑动图片

    ref:http://www.swiper.com.cn/usage/index.html help:https://segmentfault.com/a/1190000002962202 src: ...

  10. 关闭QtCreator的vim风格编辑模式

    今天不小心点到了键盘的快捷键Alt+V,使QtCreator进入了vim风格编辑模式,导致快捷键拷贝粘贴都不正常,找了下资料才发现是这个问题.具体操作如下: 打开QtCreator去掉下列位置的勾选或 ...