<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<div id="wrap" style="width: 100px;">123</div>

<script>

    /*

    * 合法标签属性

    *   style 这个属性非常特殊

    *   一个节点对象style属性是存储着这个节点所有！！！内联/行内样式！！！的对象

    */

    let oWrap = document.getElementById('wrap');

    // 对于字符串是可以直接点操作直接加进去的

    oWrap.innerHTML += '456'; // >>123456

    // 这里的style属性是css样式表

    console.log( oWrap.style ); //>>CSSStyleDeclaration

    console.log(typeof oWrap.style); //>>object

    //所以这里的+=操作不能实现

    // oWrap.style += 'height:100px;background-color:pink'; //不能给对象直接添加字符串

    //他是一个object所以想要使用对象中的属性，直接点属性

    oWrap.style.height = '100px';

    //驼峰命名 把-号改为后一个字母大写

    oWrap.style.backgroundColor = 'red';

</script>

</body>

</html>

05-3-style标签属性的更多相关文章

  1. 26 组件中style标签lang属性和scoped属性的介绍

    普通的style标签只支持普通的样式,如果想要启用scss或less,需要为style元素,设置lang属性 只要 咱们的style标签,是在 .vue 组件中定义的,那么,推荐都为style开启sc ...

  2. HTML5 Audio/Video 标签,属性,方法,事件汇总

    HTML5 Audio/Video 标签,属性,方法,事件汇总 (转) 2011-06-28 13:16:48   <audio> 标签属性:src:音乐的URLpreload:预加载au ...

  3. html标签属性（attribute）和dom元素的属性（property）

    简介 attribute和property都有属性之意,但对于attribute和property的区分其实并不难.从对象来说,attribute是html文档上标签属性, 而property则是对应 ...

  4. PHP通用的XSS攻击过滤函数，Discuz系统中 防止XSS漏洞攻击，过滤HTML危险标签属性的PHP函数

    XSS攻击在最近很是流行,往往在某段代码里一不小心就会被人放上XSS攻击的代码,看到国外有人写上了函数,咱也偷偷懒,悄悄的贴上来... 原文如下: The goal of this function ...

  5. Dom之标签属性

    一.标签默认属性的查找与修改 查找 <!DOCTYPE html><html lang="en"><head> <meta charset ...

  6. ECSide标签属性说明之<ec:column>

    <ec:column>标签 ◆ 属性: columnId描述: 单元格的id,相当于<td>的id属性 ◆ 属性: title描述: 列在列表表头里显示的名称. ◆ 属性: p ...

  7. 【HighCharts系列教程】八、Html标签属性——Labels

    一.labels属性说明 Labels属性允许在HighCharts图表的任意位置添加任意的html代码.可以实现许多自定义内容. 二.labels属性详解 参数 子参数 说明 默认值 items — ...

  8. HTML5 Audio/Video 标签,属性,方法,事件汇总 （转）

    HTML5 Audio/Video 标签,属性,方法,事件   <audio> 标签属性:src:音乐的URLpreload:预加载autoplay:自动播放loop:循环播放contro ...

  9. HTML5 Audio/Video 标签,属性,方法,事件汇总 （转）

    标签属性:src:音乐的URLpreload:预加载autoplay:自动播放loop:循环播放controls:浏览器自带的控制条 1 http://www.abc.com/test.mp3&quo ...

  10. vue2.0 之标签属性

    标签属性v-bind <template> <div> <ul> <li v-for="item in list"> {{ item ...

随机推荐

  1. ResultSetMetaData中getColumnLabel和getColumnName的区别

    利用jdbc连接数据库查询时,通常返回的结果就是每行数据的键值对集合.这时我们需要知道查询出来的数据有哪些字段.根据ResultSet结果集得到的ResultSetMetaData就可以获取到每个字段 ...

  2. gmock 简单笔记

    std::shared_ptr<MockThreadRCInvester> spMockaAcc; HelperThreadRCInvester helperAcc; // spMockA ...

  3. sleep()与wait()的区别

    ①sleep()实现线程阻塞的方法,我们称之为“线程睡眠”,方式是超时等待,怎么理解?就是sleep()通过传入“睡眠时间”作为方法的参数,时间一到就从“睡眠”中“醒来”: ②wait()方法实现线程 ...

  4. Delphi窗体间发送消息或字符串

    在Delphi 开发中,常常应用到窗体消息传递,以达成某种操作要求,以下列举一个应用的例子,供大家参考. 自定义过程/函数方法://发送字符串到指字句柄的窗口中 (接收窗体需用发送时的消息常量WM_C ...

  5. javascript和jquery

    JavaScript 1.概述 JavaScript是一种基于对象和事件驱动,并具有安全性能的脚本语言. 2.语法 HTML 中的脚本必须位于 <script> 与 </script ...

  6. let能否完全替代IIFE

    let是什么 http://es6.ruanyifeng.com/#docs/let 最近,我写了一篇关于syntax of Java’s IIFE pattern的文章,来解释为什么我们用现在的方式 ...

  7. gradle 排除冲突依赖包

    1 , 如何查看jar包依赖源 2 结果显示: 3 排除

  8. nginx下Thinkphp 隐藏index.php

    thinkphp config配置: 'URL_MODEL' => '2', //URL模式 nginx rewrite配置: location / { if (!-e $request_fil ...

  9. DNS配置-BIND安装配置全过程

    下载地址:ftp://ftp.isc.org/isc/ 下载bind,我下载的是bind-9.11.13.tar.gz 我下载的文件放在/root目录下进入目录解压缩 [root@localhost ...

  10. winform程序捕获全局异常，对错误信息写入日志并弹窗

    使用场景:在winform程序中如果没对方法进行try catch操作,若方法内出错,则整个程序报错并退出,如下图 如果程序已在客户手中,若没对错误的详细信息进行拍照,我们则不知道错误原因是什么.我们 ...