原生js修改html,原生JS设置样式并恢复默认样式

2024-05-09 07:59:12

HTML>

javascript

body{font-size:12px;}

#txt{

height:400px;

width:600px;

border:#333 solid 1px;

padding:5px;}

p{

line-height:18px;

text-indent:2em;}

JavaScript课程

JavaScript为网页添加动态效果并实现与用户交互的功能。

1. JavaScript入门篇，让不懂JS的你，快速了解JS。

2. JavaScript进阶篇，让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。

3. 学完以上两门基础课后，在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。

//定义"改变颜色"的函数

function setColor(obj){

obj.style.color = "#f40";

}

//定义"改变宽高"的函数

function setHeight(obj){

obj.style.height = "600px";

}

//定义"隐藏内容"的函数

function hide(obj){

obj.style.display = "none";

}

//定义"显示内容"的函数

function show(obj){

obj.style.display = "block";

}

//定义"取消设置"的函数

function cancel(obj){

var msg = confirm("取消以上的设置");

if(msg){

obj.removeAttribute('style');//取消设置恢复默认雅样式

}else{

alert("好玩吗？");

}

}

原生js修改html,原生JS设置样式并恢复默认样式相关推荐

php输入文本框样式,【js】：检测用户输入、文本框默认样式设置、设计表格样式实现全选反选...
Topic 1 : 检测用户的输入 : 题目要求: 编写一个用户注册页面检测用户名是否是6位以下,密码是否是8位以上,如果不满足要求高亮显示文本框 : 代码如下 : 用户注册页面 .bg {back ...
LVGL|lvgl教程之修改lvgl tabview部件顶部框(选项卡)的默认样式
效果预览前言 lvgl提供了非常多的部件(30多个)给用户使用,这些部件的所有样式都是可以修改的.它们都有默认的样式,但是当我们觉得默认的样式不合适自己项目的时候可以就需要进行修改了,本文来教大家怎 ...
Word 恢复默认样式
1.关闭所有的 Office 软件: 2.在地址栏输入: C:\Users\Administrator\AppData\Roaming\Microsoft\Templates 然后把里面的所有文件全部 ...
word怎么恢复默认样式
有时候我们在使用word的过程中会不小心替换了word的默认样式,那么需要恢复原有样式该如何操作呢? 方法如下 1.关闭所有word2007文档. 2.打开任意一个文件夹,在地址栏中输入:%USERP ...
world计算机恢复出厂设置,Word怎么恢复默认设置? Word恢复默认设置的四种方法
在使用word的过程中,我们有时不知道怎么就突然让word的默认格式等发生了变化,每次编辑都要重新设置回来,非常的麻烦,这时候我们就希望能够恢复word的默认设置,那么如何恢复word默认设置呢? 方 ...
设置video标签的默认样式
多媒体事件(Media Events) 通过视频(videos),图像(images)或者音频(audio) 触发该事件,多应用于HTML媒体元素比如 <audio>, <embed ...
修改谷歌浏览器账号密码自动填充功能的默认样式，elementUI
/deep/ .el-input__inner {-webkit-text-fill-color: #f0f0f0; //文字颜色caret-color: #fff; //光标颜色box-shadow ...
Swiper轮播图插件之如何修改前进后退按钮swiper-button-prev和swiper-button-next的默认样式
第一步: 在轮播图最外层的容器中将原本前进后退按钮的大小设置为0 注意: Swiper6之前的默认容器是'.swiper-container',Swiper7之后的默认容器是'.swiper'. .s ...
修改element-ui中的el-card标签的头部默认样式
<el-card class="task_one-card"><div slot="header" class="clearfix& ...

最新文章

热门文章