这里介绍了javascript的4个基本方法的应用
getElementById()
getElementsByTagName()
getAttribute()
setAttribute()
这里还介绍了简单的css应用
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Welcome to try to use javascript</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
body {
color:white;
background-color:black;
}
.special{/*如果(body)css中其他地方没有class=special的话*/
color:blue;
font-style:italic;
}
/*h2的class=special*/
h2.special{
text-transform:uppercase;
}
/*ul的独享样式*/
#purchases{
border:1px solid white;
background-color:#333;
color:#ccc;
}
#purchases li{
font-weight:bold;
}
</style>
<script type="text/javascript" src="example.js"></script>
</head>
<body>
<h1>This is test javascript</h1>
<h2 class="special">So do this</h2>
<p class="special" title="this is a attribute">Don't forget to buy this stuff</p>
<ul id="purchases">
<li>A tin of beans</li>
<li>Cheese</li>
<li>Milk</li>
</ul>
<script type="text/javascript">
//测试getElementById()和getElementsByTagNam()
//alert(typeof document.getElementById("purchases"));
var items=document.getElementsByTagName("li");
for(var i=0;i<items.length;i++){
alert(typeof items[i]); //输出object
}
var shopping=document.getElementById("purchases");
var its=shopping.getElementsByTagName("*")
//如果直接是document.getElementsByTagName("*")的话，找的是全部对象(object)
alert(its.length);//输出 3, 3是ul中含有的3个li的数
//测试getAttribute()
var params=document.getElementsByTagName("p");
for(var i=0;i<params.length;i++){
// alert(params[i].getAttribute("title")); //输出object
//下面写法更容易理解
var title_text=params[i].getAttribute("title");
if(title_text!=null) alert(title_text);
}
//测试setAttribute()
var shopping2=document.getElementById("purchases");
alert("shopping2 "+shopping2.getAttribute("title"));//输出shopping2 null
shopping2.setAttribute("title","a list of goods");
alert("shopping2 "+shopping2.getAttribute("title"));//输出shopping a list of goods
</script>
</body>
</html>
分享到：
相关推荐
个人Javascript学习笔记 精华版 本资源为个人Javascript学习笔记的精华版，涵盖了Javascript的基础知识、事件处理、对象和系统函数、浏览器对象等方面的内容。下面是对每个知识点的详细说明： 1. 什么是JavaScript...
HTML+CSS+JavaScript教程学习笔记HTML+CSS+JavaScript教程学习笔记 HTML+CSS+JavaScript教程学习笔记HTML+CSS+JavaScript教程学习笔记 HTML+CSS+JavaScript教程学习笔记HTML+CSS+JavaScript教程学习笔记 ...
以上是JavaScript学习笔记中提到的一些核心知识点，通过对这些知识点的理解和熟练应用，可以为进一步学习和掌握JavaScript打下坚实的基础。在实际开发过程中，结合具体的项目需求，这些知识会得到更深入的拓展和应用...
JavaScript基础知识点总结 JavaScript是一种高级的、动态的、基于对象的客户端脚本语言。它是在网页上执行的脚本语言，能实现网页的交互功能。下面是该资源中的重要知识点总结： 一、 JavaScript 基本概念 * ...
JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和...
### JavaScript学习笔记精要 #### JavaScript简介 JavaScript是一种强大的、多用途的脚本语言，用于增强网站的交互性和用户体验。它是由Netscape公司的Brendan Eich在1995年发明的，并且迅速成为了Web开发的标准之...
这份"javascript入门学习笔记"旨在为初学者提供一个全面且深入的JavaScript学习路径。 一、基础语法 JavaScript的基础包括变量、数据类型、操作符、流程控制等。变量用于存储数据，数据类型分为基本类型（如字符串...
本学习笔记将深入探讨JavaScript的核心概念，包括变量、数据类型、操作符、控制流程、函数、对象、数组、原型链、闭包等，并结合实际示例，如my.js、order.js、login.js等文件，来讲解其在实际项目中的应用。...
这份“javascript学习笔记整理知识点整理”是针对初学者的一份宝贵资料，涵盖了JavaScript的基础知识，旨在帮助新手快速入门并掌握这门语言的核心概念。 一、变量与数据类型 在JavaScript中，变量用于存储数据。...
这篇学习笔记主要涵盖了JavaScript的基础语法和客户端JavaScript的相关知识。 1. **JavaScript基本语法**： - **变量声明**：未声明的变量尝试读取时会产生错误，而写入未声明的变量会创建一个全局变量。 - **...
JavaScript学习笔记讲解版参考.pdf是一份详尽的教程，涵盖了从基础到进阶的JavaScript知识。这份笔记首先从CSS样式表开始，引导读者理解网页样式的设置与应用。 1. CSS（Cascading Style Sheets）样式表是用于控制...
Javascript学习笔记PPTJavascript学习笔记PPTJavascript学习笔记PPTJavascript学习笔记PPTJavascript学习笔记PPTJavascript学习笔记PPTJavascript学习笔记PPTJavascript学习笔记PPTJavascript学习笔记PPTJavascript...
JavaScript学习笔记是一本关于JavaScript编程语言的教材，该教材通过丰富的实例，系统地介绍了JavaScript的基础知识和实际应用技巧，帮助读者一步步掌握客户端编程技术。本书共分为九章，每一章都有其特定的主题，...
前端学习笔记网站（HTML5+CSS3+JavaScript前端网页web课程设计）.rar前端学习笔记网站（HTML5+CSS3+JavaScript前端网页web课程设计）.rar前端学习笔记网站（HTML5+CSS3+JavaScript前端网页web课程设计）.rar ...
1. **字符集**：JavaScript采用Unicode字符集编码，这是因为Unicode可以涵盖全球所有书面语言，确保程序的国际化兼容性。每个JavaScript字符由两个字节表示，基于其16位编码系统。 2. **大小写敏感**：JavaScript是...
1. 内嵌式：直接将JavaScript代码写在HTML文件中。 2. 外链式：将JavaScript代码放在独立的.js文件中，通过`<script>`标签引入。 3. 行内式：将JavaScript代码作为HTML标签的属性，如`onclick`事件处理程序。 注释...