属性的操作包括:读和写

方法:

  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. MaCrea Lit Sphere maps

    http://www.zbrushcentral.com/showthread.php?92157-MaCrea-Material-Creation-Tool 这边提供几个可以获取MatCap贴图的网 ...

  2. 电子商务网站SQL注入项目实战一例(转载)

    故事A段:发现整站SQL对外输出: 有个朋友的网站,由于是外包项目,深圳某公司开发的,某天我帮他检测了一下网站相关情况. 我查看了页面源代码,发现了个惊人的事情,竟然整站打印SQL到Html里,着实吓 ...

  3. 如何得到DataTable的列名

    foreach (DataColumn dc in dtfood.Columns) { string lm = dc.ColumnName; }

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

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

  5. loadrunner手动生成脚本函数

    1.点击insert

  6. Linux统计文件夹占用空间大小--du命令基本用法

    命令行环境下要知道linux系统里一个文件夹以及其包含的文件实际所占用的空间大小,linux自带的命令 du可以很好地满足需求. 其他的用法我就不一一写出来了,就列本人觉得会用得最多的,直接上: $ ...

  7. mybatis 学习一 总体概述

    mybatis使用起来不复杂,大体上来说,就是将db连接信息,所有的sql语句信息,都放到配置文件里面,然后去读配置信息,根据db信息,创建好session工厂,然后拿到sqlsession回话之后, ...

  8. shell入门-awk-1

    awk对于sed grep的优势在于分段,把分隔符分割成一小段一小段,针对段进行匹配,替换,操作,逻辑判断,比较...等 awk的基本操作 [root@wangshaojun ~]# awk -F ' ...

  9. 点云视窗类CloudViewer

    博客转载自:http://www.pclcn.org/study/shownews.php?lang=cn&id=149 点云视窗类CloudViewer是简单显示点云的可视化工具类,可以让用 ...

  10. pig入门教程(2)

    本文可以让刚接触pig的人对一些基础概念有个初步的了解. 本文的大量实例都是作者Darran Zhang(website: codelast.com)在工作.学习中总结的经验或解决的问题,并且添加了较 ...