JS修改属性

一般修改单个属性是通过JS修改的,比较方便。改多个属性通过css样式改更方便。

  1.特殊:通过JS修改包含"-"符号的属性,例如margin-top

// 特殊 修改包含"-"符号的属性,例如margin-top
// oBox[1].style.margin-top="50px"; // 错误写法,js将“-”认成减号
有两种写法:
  1. // oBox[1].style.marginTop="50px"; // 1.驼峰写法
  2. oBox[1].style["margin-top"]="50px"; // 2.中括号括起来

  2.普通属性 不含  ''-'' 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
* {
margin: 0;
padding: 0;
}
</style>
<style>
div{
width: 100px;
/*height: 100px;*/ /*高度写这儿,弹不出属性*/
background: yellow;
}
</style>
</head>
<body>
<div style="height: 100px">测试JS修改属性</div>
<script>
var oBox=document.getElementsByTagName("div");
alert(oBox[0].style.height); // 弹出高度,只能 弹出行内属性
// 分别修改高度和宽度
// oBox[0].style.height="150px";
// oBox[0].style.width="150px"; // 同时修改高宽度
oBox[0].style.cssText="height:150px;width:150px"
</script>
</body>
</html>

效果:     之前                  之后

js六大数据类型

<script>
/*
js六大数据类型
number——数字 在js里面的小数和整数统一都是数字 -2^53 -- 2^53 超出范围之后精度就会不准确
string——字符串
boolean——布尔值 true false
function——函数
undefined——未定义 一个变量声明之后没有赋值就是undefined
object——对象
在js里面null属于对象类型,但是它不具有很多对象的共性,所以很多资料将它归为单独一类数据类型null
*/
</script>

JS修改属性,六种数据类型的更多相关文章

  1. 原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较

    一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...

  2. js修改input的type属性问题

    js修改input的type属性有些限制.当input元素还未插入文档流之前,是可以修改它的值的,在ie和ff下都没问题.但如果input已经存在于页面,其type属性在ie下就成了只读属性了,不可以 ...

  3. js介绍,js三种引入方式,js选择器,js四种调试方式,js操作页面文档DOM(修改文本,修改css样式,修改属性)

    js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...

  4. jsp——js事件修改属性样式的两种方法(直接赋值、修改属性)、验证表单符合某要求、阻止表单提交、告诉浏览器不要缓存

    代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncodi ...

  5. js修改html中class属性

    document.getElementById("tr").setAttribute("class","styleclass"); 其中  ...

  6. selenium web driver 使用JS修改input属性

    selenium获取input时候,发现type=”hidden” 的input无法修改value,经牛人指点,可以使用js修改 首先html源文件如下,设置为text .hidden.submit ...

  7. js 六种数据类型的区别及bool 转换判断

    一.bool型转换判断: 1.true 和 1 比较是相同,false 和 0 比较是相同(是 “==” 比较),因为内部会实现数据类型的 转化,将true 转换成1,将false 转换成0, js ...

  8. 使用原生JS 修改 DIV 属性

    本例参考并改进自:https://www.jianshu.com/p/2961d9c317a3 大家可以一起学习!! <!DOCTYPE html> <html lang=" ...

  9. js六种数据类型

    六种数据类型: undefined . boolean  .string .number .object .function 效果地址:https://scrimba.com/c/cEedDGTd 代 ...

随机推荐

  1. win10笔记本实现双屏显示的自如切换

    前言 使用电脑的过程中想一边看内容,一边进行编辑,这就涉及到双屏显示并实现扩展分屏,本文就介绍一下这些操作. 工具 win10-thinkpad-E470:另一块显示屏(博主的是戴尔的显示器):一条外 ...

  2. C#Delegate.Invoke、Delegate.BeginInvoke And Control.Invoke、Control.BeginInvoke

    作者:EasonLeung 一.Delegate的Invoke.BeginInvoke 1.Delegate.Invoke (委托同步调用) a.委托的Invoke方法,在当前线程中执行委托. b.委 ...

  3. RPC好,还是RESTful好?

    看到知乎上有这样一个问题 WEB开发中,使用JSON-RPC好,还是RESTful API好? 还有其他优秀的推荐方案吗? -------------------------------------- ...

  4. .NET基金会成立

    作者 Jonathan Allen ,译者 臧秀涛 发布于 2014年4月8日 随着.NET基金会的成立,微软在成为主要的开源参与者的道路上又前进了一步.该基金会的宗旨是“成为越来越多的开源.NET项 ...

  5. nyoj 光棍的yy

    655-光棍的yy 内存限制:64MB 时间限制:1000ms Special Judge: Noaccepted:2 submit:3 题目描述: yy经常遇见一个奇怪的事情,每当他看时间的时候总会 ...

  6. 声明变量(Declared Variable)和非声明变量(Undeclared Variable)的区别

    声明变量的作用域限制在其声明位置的上下文中,而非声明变量总是全局的. 声明变量在任何代码执行前创建,而非声明变量只有在执行赋值操作的时候才会被创建. 声明变量是它所在上下文环境的不可配置属性(non- ...

  7. socket、WebSocket

    WebSocket 协议本质上是一个基于TCP的协议,它由通信协议和编程API组成,WebSocket能够在浏览器和服务器之间建立双向连接,以基于事件的方式,赋予浏览器实时通信能力. socket本质 ...

  8. mySQL 教程 第3章 数据类型和数据完整性

    准备数据库 创建练习数据库,以下实验都是在这个数据库中完成. 练习1:比较各种数值型 create table tmp1 ( id INT, name VARCHAR(25), deptId deci ...

  9. jquery.validate.js remote (php)

    网上的人不厚道呀 validate 这玩意的异步是 返回的 echo 'true'  或者 echo 'false';很少有人说呀~.~  转载了一篇原文: jquery.validate.js对于数 ...

  10. You Arent Gonna Need It 理解

    软件开发是一项无法驾驭全局的工作,其工作效率,工作精神都高度依赖需求反馈. 开发不存在需求的功能,实际上是除了要开发软件,还要构思需求,这样一正一反,严重消耗了脑力资源. 如果是自己开发软件,需求来自 ...