javascript

2021/9/14 11:36:23

编程Tag： js javascript 元素 var style document ele1

本文主要是介绍javascript，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

前言

初学js笔记

一、获取HTML元素

var ele1 = document.querySelector('css选择器');//返回来的是满足条件的第一个元素！！！

ele1 获取回来的那个

document.querySelectorAll('css选择器') //返回来就是满足条件的所有元素，获取回来的是一个数组。

二、js触发事件js修改外部的类样式

1.事件

鼠标点击 onclick

鼠标移入 onmouseover

鼠标移出 onmouseout

鼠标移动 onmousemove

键盘按下 onkeydown

键盘弹起 onkeyup

2.绑定事件

元素.事件类型 ele1.onclick

3.事件处理的代码

元素.事件类型 = function(){

//事件触发后要执行的代码！

}

4.js修改行内样式

元素.style.属性名 = 属性值;

不过js不支持-，像这种font-size类型的属性名写成 fontSize。

5.js修改外部的类样式

设置元素的类值为... 可将类名修改为双引号里的。

元素.className = ""

获取元素的类样式集合:

元素.className

案例

点击按钮可以增大减小字体。

<!DOCTYPE html>

<head>

<title>Document</title>

<style>

.box{

width: 800px;

margin: 50px auto;

border: thick double #32a1ce;

}

button{

/* 鼠标样式属性 */

cursor: pointer;

/* margin-top:px ; */

position: absolute;

}

.reduce{

margin-left: 50px;

}

</style>

</head>

<body>

<div class="box" style="font-size: 20px;">MIME

文本文件在MIME标准中的类型为“text/plain”，此外，它通常还附加编码的信息。在Mac OS X出现前，当Resource fork指定某一个文件的类型为“TEXT”时，Mac OS就认为这个文件是文本文件。在Windows中，当一个文件的扩展名为“txt”时，系统就认为它是一个文本文件。此外，处于特殊的目的，有些文本文件使用其它的扩展名。例如，计算机的源代码也是文本文件，它们的后缀是用来指明它的程序语言的。

</div>

var x=20;

var ele1= document.querySelector('.box');

var ele2= document.querySelector('.increase');

var ele3= document.querySelector('.reduce');

ele2.οnclick=function(){

++x;

ele1.style.fontSize=x+"px";

ele2.style.color="bule";

ele3.style.color="black";

}

ele3.οnclick=function(){

--x;

ele1.style.fontSize=x+"px";

ele2.style.color="black";

ele3.style.color="bule";

}

</script>

</body>

</html>

这篇关于javascript的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！