获取元素方法与数组

获取元素方法:

(1), 通过js的dom方法:getElementById() :根据元素的id获取元素
(2),通过getElementsByClassName():根据元素的class获取页面元素;
(3),通过getElementsByTagName(): 根据元素标签的名称获取页面元素;


<html>
    <head>
       <meta charset="utf-8" />
       <title></title>
       <script type="text/javascript">
//通过getElementById();
window.onload=function(){
var div=document.getElementById('id2');
div.style.width='300px';
div.style.height=300+'px';
div.style.borderRadius=150+'px';
div.style.background='pink';
div.style.margin='auto';
div.style.color='purple';
div.innerText='待我半生戎马,许你浪迹天涯';
div.innerText='<br/>'
div.innerText='待我了无牵挂,许你花前月下';
div.style.textAlign='center';div.style.lineHeight=300+'px';
var divContent=div.innerText;(获取页面中文本元素)
var divContent=div.innerHtml;(获取页面中文本元素,包括HTML元素)
alert(divContent);

通过getElementsByClassName();
var div=document.getElementsByClassName('cs5')[0];
div.style.width=200+'px';
div.style.height=200+'px';
div.style.background='green';
var div=document.getElementsByClassName('cs5')[1];
div.style.width=300+'px';
div.style.height=300+'px';
div.style.background='blue';


通过getElementsByTagName();
var div=document.getElementsByTagName('div')[1];
 var div=div.innerHTML;
 alert(div);


</script>
 </head>
 
 <body>
  <div id="id2"></div>
   <div class="css">
    <div class="cs5"></div>
    <div class="cs5"></div>
    <div class="cs5"></div>
  </div>
 </body>
</html>

数组

1,声明数组
语法结构:
var 数组名称=new Array();
var 数组名称=[值];
2,数组的初始化
js是一种弱类型的脚本语言,索引可以存储不同数据类型

2,数组的初始化
初始化一个数组有三种方法:
第一种方式:
数组名称=new Array();
数组名称[0]=值;
数组名称[1]=值;
数组名称[2]=值;
第二种方式:数组名称=new Array(‘值’,‘值’,‘值’,‘值’);
第三种方式:数组名称=[‘值,值,值’];
数组的属性:length 获取数组的数据长度
3. 操作数组中数据的方法
(1) Join():将数组成员通过一个分割符合并成字符串
(2) Push()和 pop():从数组最后增加成员或是删除成员
(3) Unshift()和 shift():从数组的前面增加成员或是删除成员
(4) Reverse():将数组的数值进行翻转
(5) Indexof():返回数组中元素第一次出现的索引值
(6) Splice():在数组中增加或是删除成员
(7) Slice():从一个数组中选择(截取)元素

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_43437202/article/details/84729051