javascript学习过程中的一些体会和重点（1）

来源：互联网发布：js修改sass变量编辑：程序博客网时间：2024/05/17 09:02

1、html代码可以看成是树状结构，其中只有<html>结点没有父母、兄弟结点，可以看做是树状结构的根节点。

2、在运用css时，一个结点的class属性可以添加数个类名，表示该结点同时属于不同的几个类。例如：<li class="sale important"></li> (其中，"sale"和"important"分别是两个类。而且在class属性中类的顺序并没有影响，即class="sale important" 相当于class="important sale")

3、javascript代码不建议直接写在html文件中，推荐写在.js文件中，并且引入html文件。（<script src="……"></script>）

4、javascript命名规则：在命名变量时，用下划线来分割各个单词，在命名函数时，从第二个单词开始把每个单词的第一个字母大写（也就是所谓的驼峰命名法）。

5、要注意TagName和ClassName是有“s”的；

document.getElementById("……");
document.getElementsByTagName("……");
document.getElementsByClassName("……");

有一些浏览器不支持document.getElementsByClassName("……");我们可以用一个方法实现这个功能

function getElementsByClassName(node,classname){
if(node.getElementsByClassName){
return node.getElementsByClassName(classname);
}
else{
var results=new Array();
var elems=node.getElementsByTagName("*");
for(var i=0;i<elems.length;i++){
if(elems[i].className.indexOf(classname)!=-1){
results[results.length]=elems[i];
}
}
return results;
}
}

6、elems[i].className.indexOf(classname)!=-1的含义：indexOf的作用是将括号中的对象（classname）与indexOf的根对象（elems[i].className）进行比较，返回括号中对象在跟对象中第一次出现的位置。如果没有出现，则返回-1。

即，我们可以用indexOf来达到对字符串对象进行比较的目的。

附：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Shopping List</title><link href="a.css" rel="stylesheet" type="text/css" /></head><body><h1>What to buy</h1>    <p title="a gentle reminder">Don't forget to buy this stuff.</p>    <ul id="purchases">    <li>A tin of beans</li>        <li class="sale">Cheese</li>        <li class="sale important">Mlik</li>    </ul>    <script>    //alert(typeof document.getElementById("purchase"));//alert(document.getElementsByTagName("li").length);//alert(document.getElementsByTagName("*").length);//var sale=document.getElementsByClassName("sale");//alert(sale.length);//alert(document.getElementsByClassName("important sale").length);function getElementsByClassName(node,classname){if(node.getElementsByClassName){return node.getElementsByClassName(classname);}else{var results=new Array();var elems=node.getElementsByTagName("*");for(var i=0;i<elems.length;i++){if(elems[i].className.indexOf(classname)!=-1){results[results.length]=elems[i];}}return results;}}var shopping=document.getElementById("purchases");var sales=getElementsByClassName(shopping,"sale");alert(sales.length);    </script></body></html>

0 0