js——基础知识

最新推荐文章于 2024-05-12 06:49:26 发布

jacky__bj

最新推荐文章于 2024-05-12 06:49:26 发布

阅读量347

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/baojie1022/article/details/45396385

版权

前端专栏收录该内容

17 篇文章 0 订阅

订阅专栏

1、js需要写在

<script type="text/javascript">  这里！这里！</script>

当使用jquery的时候，需要先导入jquery库，

<script type="text/javascript" src="${ctx}/style/js/jquery.min.js">这里不允许写东西！！！</script> 
<script type="text/javascript">  还是写在！这里！这里！</script>

2、设置className属性值

document.getElementById("id").className = "curr";// 设置为“curr”

3、数据类型问题

var custom;

查看数据类型：alert(typeof(custom));---undefined

if(preGcId == undefined){
	// 判段使用 undefined 而不是 "undefined"		 
} 
Undefined 和 Null 
Undefined 这个值表示变量不含有值。可以通过将变量的值设置为 null 来清空变量。
4、使用js查找html元素通常，通过 JavaScript，您需要操作 HTML 元素。

为了做到这件事情，您必须首先找到该元素。有三种方法来做这件事：
 
    通过 id 找到 HTML 元素：var x=document.getElementById("intro");

    通过标签名找到 HTML 元素：
                         本例查找 id="main" 的元素，然后查找 "main" 中的所有 <p> 元素：
                         var x=document.getElementById("main");
                         var y=x.getElementsByTagName("p");

    通过类名找到 HTML 元素: 通过类名查找 HTML 元素在 IE 5,6,7,8 中无效。在另一个文档中有一个自定义的方法

5 、改变 HTML 内容

<html>
<body> 
<p id="p1">Hello World!</p> 

<script>
document.getElementById("p1").innerHTML="New text!";
</script>

</body>
</html>

6、改变 HTML 属性

<!DOCTYPE html>
<html>
<body>

<img id="image" src="smiley.gif">

<script>
document.getElementById("image").src="landscape.jpg";
</script>

</body>
</html>

7、改变 HTML 样式

例子 1

<p id="p2">Hello World!</p>

<script>
document.getElementById("p2").style.color="blue";
</script>

例子 2：本例改变了 id="id1" 的 HTML 元素的样式，当用户点击按钮时：

<h1 id="id1">My Heading 1</h1>

<button type="button" οnclick="document.getElementById('id1').style.color='red'">
点击这里
</button>

例子 3：如何使元素不可见。您希望元素显示或消失吗？

<html>
<body> 
<p id="p1">这是一段文本。</p> 
<input type="button" value="隐藏文本" οnclick="document.getElementById('p1').style.visibility='hidden'" />
<input type="button" value="显示文本" οnclick="document.getElementById('p1').style.visibility='visible'" />

</body>
</html>

8、自定义实现Switch

<div id="123" style="display:none;">
<p>显示的内容</p>
</div>
<div id="switch" οnclick="mySwitch()">点击显示</div>
<script language="javascript">
function mySwitch(){
    document.getElementById('123').style.display = document.getElementById('123').style.display=='none'?'block':'none';
}
</script>