Dom7(动态创建标签,获取页面元素)

最新推荐文章于 2024-08-31 08:08:39 发布

天赋进行时

最新推荐文章于 2024-08-31 08:08:39 发布

阅读量2k

点赞数

分类专栏： JS-Dom-Jquery

本文链接：https://blog.csdn.net/xbc1213/article/details/50577804

版权

JS-Dom-Jquery 专栏收录该内容

44 篇文章 0 订阅

订阅专栏

动态创建标签

关键字:wirite
语法:document.write(‘内容’);
注意:该方法可以动态创建标签,里面的内容可以直接写标签语句.可以用作镶嵌广告,如果在页面加载后执行,那么页面的其他标签都将会小时.
实例:

 <script type="text/javascript">
     onload=function(){

         //第一个作用,可以动态创建标签
         //可以镶嵌广告
         //缺点:如果在页面加载后执行,那么页面的其他标签都没有了
     document.write('<font name="全新硬笔行书简" color="blue" size="7">我来了</font>'); //在这里需要注意 外面是单引号,里面如果还需要单引号的话则使用双引号

     };
     </script>

知识点:如果外面是单引号,里面还需要单引号的话则使用双引号.

获取页面元素的三种方法

第一种:通过id获取该元素
语法:document.getElementById(‘id’)

第二种:通过name获取对象.因为name属性是可以重复的.所以这里有s及返回的是一个数组.
语法:var btns=document.getElementByName(‘name’);
这里的btns是一个数组.

第三种:通过TagName获取,
翻译:Tag 标签
语法:document.getElementsByTagName(‘input’);//其中input为标签

实例:

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
<script type='text/javascript'>
//通过id获取该元素
//document.getElementById('n1');
//通过name获取对象 注意这里的element是有s的
//onload=function(){
//var btns= document.getElementsByName('txt');
//for(var i=0;i<btns.length;i++){
//alert(btns[i].value);
//}
//};
//第三种方法 通过TagName 标签名字
onload=function(){
var kind= document.getElementsByTagName('input');
for(var i=0;i<kind.length;i++){
alert(kind[i].value);
}
};
//这是三种获取元素的方式.此处切记不要使用forin循环
//forin循环循环的是键值对,不是对象本身.建议使用for循环.

//注意该方法返回的是一个数组 因为name不唯一

</script>

 </head>
 <body>
  <input type='text' name='txt' value='1'>
    <input type='text' name='txt' value='2'>
      <input type='text' name='txt' value='3'>
        <input type='text' name='txt' value='4'>
          <input type='text' name='txt' value='5'>
 </body>
</html>