属性的操作包括：读和写

方法：

　　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. spring初始化顺序

    首先,Spring bean的默认加载顺序是怎么控制的 工程中有2个bean,A和B,其中必须先初始化A再初始化B,但是没有depend-on或者Order等方式去保证,只不过恰好刚好这么运行着没出事 ...

  2. 二 lambda表达式

    1:lambda写的好可以极大的减少代码冗余,同时可读性也好过冗长的内部类,匿名类. 2: lambda表达式配合Java8新特性Stream API可以将业务功能通过函数式编程简洁的实现. 3: l ...

  3. 配置IIS服务：无法找到该页 您正在搜索的页面可能已经删除、更名或暂时不可用。

    1.配置IIS服务器时,在默认网站创建虚拟目录XXX.然后右击启动页面.aspx,“浏览” 2.  出现错误: 无法找到该页 您正在搜索的页面可能已经删除.更名或暂时不可用. ------------ ...

  4. 针对nginx的内核优化

    关于内核参数的优化: net.ipv4.tcp_max_tw_buckets = 6000timewait的数量,默认是180000.net.ipv4.ip_local_port_range = 10 ...

  5. 菜鸟学Nhibernate 之路---(1)

    首先说一下我为什么要学这个Nhibernate,现在在公司做项目后台的逻辑层都是用动软生成的简单三层,搞来搞去都是这些东西,代码冗余量很大,每个类方法基本上都一样,真是纯正的码农,虽然后来我也尝试使用 ...

  6. 12、scala隐式转换与隐式参数

    一.隐式转换 1.介绍 Scala提供的隐式转换和隐式参数功能,是非常有特色的功能.是Java等编程语言所没有的功能.它可以允许你手动指定,将某种类型的对象转换成其他类型的对象. 通过这些功能,可以实 ...

  7. CSS概念 - 可视化格式模型（一） 盒模型与外边距叠加

    可以参考<精通CSS 高级WEB标准解决方案>第三章. 可视化格式模型 可视化格式模型要掌握的3个最重要的CSS概念是 浮动.定位.盒模型. 这些概念控制在页面上安排和显示元素的方式, 形 ...

  8. Spark 各个组件关系

    Term Meaning Application User program built on Spark. Consists of a driver program and executors on ...

  9. C#在Linux上的开发指南（续）

    续之前的一篇开发指南http://www.cnblogs.com/RainbowInTheSky/p/5496777.html 部分人在部署的时候经常出现dll兼容问题(其实可以看小蝶惊鸿的文章,蝶神 ...

  10. Ubuntu16.4下安装Chrome浏览器以及Chromedriver

    一.Chrome浏览器的安装 对于谷歌Chrome32位版本,使用如下链接: wget https://dl.google.com/linux/direct/google-chrome-stable_ ...