var obj=document.getElementById('t1')

  obj.innerText

  obj.innerHTML

1.javascript

插入代码如下：

 <script type="text/javascript">

     var name="server";  //#局部变量

     age=;             /*#全局变量*/

     //for

     var names=['alex','tony','rain'];

     for(var i=;i<names.length;i++){

        console.log(i);

        console.log(names[i]);

     }

     console.log('----------')

     for (var index in names){

         console.log(names[index]);

     }

     //alert('123');

     console.log('----------')

     var name2={'name':'alex','age':}

     for(var index in name2){

         console.log(index);

         console.log(name2[index]);

     }

      //while

      //while()

      var name3='alex'

      var age3=;

      //swithc,case

      console.log('----------')

      switch (name3){

         case '':

             age3=;

             console.log(age3)

             break;

         case '':

             age3=;

             console.log(age3)

             break;

         default:

            age3=;

            console.log(age3)

      }

      console.log('----------')

      //自执行函数

       (function(arg){

         console.log(arg);

     })(''

 </script>

view code

2.DOM

文档对象模型（Document Object Model，DOM）是一种用于HTML和XML文档的编程接口。它给文档提供了一种结构化的表示方法，可以改变文档的内容和呈现方式。我们最为关心的是，DOM把网页和脚本以及其他的编程语言联系了起来。DOM属于浏览器，而不是JavaScript语言规范里的规定的核心内容。注：一般说的JS让页面动起来泛指JavaScript和Dom

var obj=document.getElementById('t1')

obj.innerText

obj.innerHTML

  <title>Django静态网页测试</title>

 //跑马灯标题显示

     function Go(){

         var content=document.title;

         var firstChar=content.charAt();

         var sub=content.substring(,content.length)

         document.title=sub+firstChar;

         //console.log(content)

     }

     setInterval('Go()',);

跑马灯

 <!DOCTYPE html>

 <html>

 <head lang="en">

   <meta charset="UTF-8">

   <title>Django静态网页测试</title>

   <style>

     .gray{

         color:gray;

     }

     .black{

         color:black;

     }

   </style>

   <script type='text/javascript'>

   //关键字搜索

     function Enter(){

         var id=document.getElementById('tip');

         id.className='black';

         if(id.value=='请输入关键字'||id.value.trim()==''){

             id.value='';

         }

     }

     function Leave(){

         var id=document.getElementById('tip');

         var val=id.value;

         id.className='black';

         if(val.length==||id.value.trim()==''){

             id.value='请输入关键字';

             id.className='gray'

             }

         else{

             id.className='balck';

             }

      }

    </script>

 </head>

 <body>

  <h1>主标题</h1>

 <table>

   <tr><td>序号</td><td>名称</td></tr>

   <tr><td></td><td>Hbase实战</td></tr>

   <tr><td></td><td>Lucene in Action</td></tr>

 </table>

 </br></br>

 搜索：<input type='text' class='gray' id='tip' value='请输入关键字' onfocus='Enter();'  onblur='Leave();'/>

 </br>

 </br>

 </br>

 用户名：<input type='text' id='t1' name='username' />

 </br></br>

 <div id='t2' name='pwd'>hello world!</div>

 <!--

 <script src="https://www.gstatic.com/og/_/js/k=og.og2.en_US.iF4jnkQuaf0.O/rt=j/t=zcms/m=def/exm=in,fot/d=1/ed=1/rs=AA2YrTv5-POC4Ks9GtGRdY2ywUWisqz7-Q"></script>

 -->

 <script type="text/javascript">

     var name="server";  //#局部变量

     age=;             /*#全局变量*/

     //for

     var names=['alex','tony','rain'];

     for(var i=;i<names.length;i++){

        console.log(i);

        console.log(names[i]);

     }

     console.log('----------')

     for (var index in names){

         console.log(names[index]);

     }

     //alert('123');

     console.log('----------')

     var name2={'name':'alex','age':}

     for(var index in name2){

         console.log(index);

         console.log(name2[index]);

     }

      //while

      //while()

      var name3='alex'

      var age3=;

      //swithc,case

      console.log('----------')

      switch (name3){

         case '':

             age3=;

             console.log(age3)

             break;

         case '':

             age3=;

             console.log(age3)

             break;

         default:

            age3=;

            console.log(age3)

      }

      //自执行函数

       (function(arg1){

         //alert(arg1);

         console.log(arg1);

         })('text')

     console.log('----------')

     //面向对象

     function Foo(name,age){

         this.name='name';

         this.age=age;

         this.Func=function(arg){

         return this.name+arg;

         }

     }

     var obj=new Foo('alex',);

     var ret=obj.Func(' so-easy');

     console.log(ret);

     /*

     alert('this is alert')

     confirm('this is confirm')

     */

     //DOM

     var obj=document.getElementById('t1')

     obj.innerText

     obj.innerHTML

     console.log(obj)

     console.log(obj.innerText)

     console.log(obj.innerHTML)

 </script>

 </body>

 </html>

关键字搜索框

JavaScript、Dom和jQuery的更多相关文章

  1. Python 【第八章】：JavaScript 、Dom、jQuery

    JavaScript 放置位置 body内部最下面,这样可以避免javascript链接失效时,长时间加载不到页面html内容 变量: var a =123 局部变量 a = 123 全局变量 作用域 ...

  2. javaScript DOM JQuery AJAX

    http://www.cnblogs.com/wupeiqi/articles/5369773.html 一 JavaScript JavaScript是一门编程语言,浏览器内置了JavaScript ...

  3. JavaScript DOM对象和JQuery对象相互转换

    1.分析源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  4. 一周一话题之四（JavaScript、Dom、jQuery全面复习总结<jQuery篇>）

    -->目录导航 一. 初探Jquery 1. 介绍 2. 基础 二. Jquery操作 1. jQuery页面加载 2. 选择器 3. 操作Dom 三. Jquery进阶 1. 隐式迭代与链式编 ...

  5. javascript DOM对象转jquery对象

    首先,假设一种情形:要在HTML文件中为一个select对象添加一个函数,这个函数的名字叫dynamic_change(this),当select的option被改变的时候调用onchange事件来处 ...

  6. Python学习笔记整理总结【web基础】【web/HTML/CSS/JavaScript/DOM/jQuery】

    一.HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以 ...

  7. 一周一话题之四（JavaScript、Dom、jQuery全面复习总结<Dom篇>）

    -->目录导航 一. 初探Dom 1. Dom介绍 二. Dom基础 1. window顶级对象 2. body.document对象事件 3. 通用的HTML元素的事件 4. 冒泡事件 5. ...

  8. javascript DOM 操作 attribute 和 property 的区别

    javascript DOM 操作 attribute 和 property 的区别 在做 URLRedirector 扩展时,注意到在使用 jquery 操作 checkbox 是否勾选时,用 at ...

  9. JavaScript DOM实战：创建和克隆元素

    DOM来创建和克隆元素. createElement()和createTextNode() createElement()和createTextNode()做的事情正如它们的名字所说的那样.最常见的J ...

  10. DOM和jQuery

    一.DOM 在学习DOM之前你应该已经具备了以下三个知识点的应用:HTML CSS javascript DOM 是 W3C(万维网联盟)的标准. W3C DOM 标准被分为 3 个不同的部分: 核心 ...

随机推荐

  1. [转]WCF的几种寄宿方式

    转自:WCF开发框架形成之旅---WCF的几种寄宿方式 WCF寄宿方式是一种非常灵活的操作,可以在IIS服务.Windows服务.Winform程序.控制台程序中进行寄宿,从而实现WCF服务的运行,为 ...

  2. 从头认识java-15.6 队列（Queue）

    这一章节我们来讨论一下队列(Queue). 1.什么是队列? 队列是一种特殊的线性表,特殊之处在于它仅仅同意在表的前端(front)进行删除操作,而在表的后端(rear)进行插入操作,和栈一样.队列是 ...

  3. CodeForces 653 A. Bear and Three Balls——（IndiaHacks 2016 - Online Edition (Div. 1 + Div. 2)）

    传送门 A. Bear and Three Balls time limit per test 2 seconds memory limit per test 256 megabytes input ...

  4. 查看scn headroom变化趋势的几种方法

    查看scn headroom变化趋势的几种方法 scn headroom问题,本文不做解释. 本文为自己的总结,脚本来自于oracle sr技术project师. 转载请注明出处http://blog ...

  5. springboot-quartz普通任务与可传参任务

    两者区别与作用: 普通任务:总调度(SchedulerFactoryBean)--> 定时调度器(CronTriggerFactoryBean) --> 调度明细自定义执行方法bean(M ...

  6. 一条SQL面试题

    求其中同一个主叫号码的两次通话之间间隔大于10秒的通话记录ID 例如:6,7,8,9,10条记录均符合 ID 主叫号码 被叫号码      通话起始时间            通话结束时间       ...

  7. hibernate初步3

    事务和并发 1.事务概念 一组不可分割的操作,事务有如下属性(ACID 属性:Atomic Consistent Isolated Durable)(1)原子性---Atomic  事务的原子性指的是 ...

  8. bzoj 2005 & 洛谷 P1447 [ Noi 2010 ] 能量采集 —— 容斥 / 莫比乌斯反演

    题目:bzoj 2005 https://www.lydsy.com/JudgeOnline/problem.php?id=2005   洛谷 P1447 https://www.luogu.org/ ...

  9. [Apple开发者帐户帮助]三、创建证书（7）创建证书签名请求

    Mac上的Keychain Access允许您创建证书签名请求(CSR). 启动位于的Keychain Access /Applications/Utilities. 选择Keychain Acces ...

  10. 【Usaco2006Mar】Milk Team Select产奶比赛

    [思路分析] 比赛的时候想到了用我确实也想到了树形DP,但是状态没有确定对,连样例都没有过 PS:这是第二道发现还可以用状态作为答案最后输出的题目 正解:树形DP(背包) 按照读进来的数据,我们先建一 ...