【JavaScript学习笔记】04 DOM操作、正则表达式

最新推荐文章于 2024-04-26 22:08:18 发布

子逊的辛酸史

最新推荐文章于 2024-04-26 22:08:18 发布

阅读量220

点赞数

分类专栏： javascript 前端文章标签： DOM 正则表达式 javascript

本文链接：https://blog.csdn.net/u013182992/article/details/80475144

版权

前端同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

javascript

4 篇文章 0 订阅

订阅专栏

2018.4.21

dom

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>DOM</title>
		<!--
			DOM
			Document Object Model
			在JS中可以吧页面里面的所有标签看作是一个对象
			
		-->
		<style>
			/*id用#+ID名*/
			#ydn{
				color: yellow;
				font-size: 35px;
				
			}
			/*yy用.+class名*/
			.yy{
				color: green;
				font-size:20px;				
			}
			
			p[name=ys] {
				color:red;
				font-size:27px ;
				display:None;
				/*None 空 不展示*/
			}
			
		</style>
	</head>
	<body>
		<!-- class可以重复，为什么有ID的修饰，但没有class的修饰 id是唯一确定的属性。-->
		<p id ="ydn" class="yy">
			云大娘准备考驾照，（报名三年了，科一还没考）。			
		</p>
		<p class = "yy"> 
			云姨准备在中医西路买一套房子。
		</p>
		<p name = "ys">
			云婶准备买辆五菱荣光~	
		</p>
		<!--
			这里是button标签，是一个按钮。
			click点击
			使用button的onclick属性，属性的值是一个函数名（）
		-->
		<button onclick="modify()"> 云大娘考驾照</button><br />
		<button onclick="buyHouse()">云姨买房子</button><br />
		<button onclick="buyCar()">云婶买车</button><br />
		<script type = "text/javascript">
			
		/*
		 	通过三种方式获取标签
		 * */
		
			function modify(){
				/*
				 通过ID属性获取到指定的标签，因为在HTML页面中，ID属性不可以重复
				 getElementById(id属性)，返回一个确定的标签。
				 */
				var aPtag = document.getElementById("ydn");
				aPtag.style.color = "purple";
			}
			
			function buyHouse() {
				/*
				 getElementsByClassName();
				 Elements 返回的是一个标签的数组，因为Class选择器可以用到多个标签上
				 
				 */
				var pArray = document.getElementsByClassName("yy")
				pArray[1].innerHTML = "房子也不大，也就200平";//innerHTML:获取内容
			}
			
			function buyCar() {
				var pName = document.getElementsByName("ys")
				pName[0].style.display = "block";//显示解锁打开。
			}
			/*
			 * 
			 * 常用4种获取标签方法。
			 getElementById();
			 通过ID属性获取到对应的元素对象
			 
			 getElementsByClassName();
			 通过class属性获取到对应的元素对象数组
			 
			 getElementsByName();
			 通过Name属性获取到对应的元素对象数组
			 
			 getElementsByTagName();
			 通过标签名属性获取到对应的元素对象数组
			 */
		</script>
	</body>
</html>

2.11 正则表达式

RegExp 对象

正则表达式是描述字符模式的对象。
    正则表达式用于对字符串模式匹配及检索替换，是对字符串执行模式匹配的强大工具。
    语法：
    var patt=new RegExp(pattern,modifiers);
    或者更简单的方式:
    var patt=/pattern/modifiers;
    如：
    修饰符
    修饰符用于执行区分大小写和全局匹配:
    var re = new RegExp("\\w+");
    var re = /\w+/;

正则表达式的使用

test()方法：
    test()方法搜索字符串指定的值，根据结果并返回真或假。
    
    var patt1=new RegExp("e");
    document.write(patt1.test("The best things in life are free"));
    
    由于该字符串中存在字母 "e"，以上代码的输出将是：
    true
    
    
exec() 方法：
    exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配，则返回 null。
    
    var patt1=new RegExp("e");
    document.write(patt1.exec("The best things in life are free"));
    
    由于该字符串中存在字母 "e"，以上代码的输出将是：
    e

子逊的辛酸史

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【JavaScript学习笔记】04 DOM操作、正则表达式

2018.4.21dom&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;DOM&lt;/title&gt; &lt;!-- DOM Document Object Model 在JS中可以吧页面里面的所有标签看作是一个对象
复制链接

扫一扫