1.  var obj=document.getElementById('t1')
  2.  
  3.   obj.innerText
  4.  
  5.   obj.innerHTML

1.javascript

插入代码如下：

  1.  <script type="text/javascript">
  2.      var name="server";  //#局部变量
  3.      age=;             /*#全局变量*/
  4.      //for
  5.      var names=['alex','tony','rain'];
  6.      for(var i=;i<names.length;i++){
  7.         console.log(i);
  8.         console.log(names[i]);
  9.      }
  10.      console.log('----------')
  11.      for (var index in names){
  12.          console.log(names[index]);
  13.      }
  14.      //alert('123');
  15.      console.log('----------')
  16.      var name2={'name':'alex','age':}
  17.      for(var index in name2){
  18.  
  19.          console.log(index);
  20.          console.log(name2[index]);
  21.      }
  22.       //while
  23.       //while()
  24.       var name3='alex'
  25.       var age3=;
  26.       //swithc,case
  27.       console.log('----------')
  28.       switch (name3){
  29.          case '':
  30.  
  31.              age3=;
  32.              console.log(age3)
  33.              break;
  34.          case '':
  35.              age3=;
  36.              console.log(age3)
  37.              break;
  38.          default:
  39.             age3=;
  40.             console.log(age3)
  41.       }
  42.       console.log('----------')
  43.       //自执行函数
  44.        (function(arg){
  45.  
  46.          console.log(arg);
  47.  
  48.      })(''
  49.  
  50.  </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

  1.   <title>Django静态网页测试</title>
  2.  //跑马灯标题显示
  3.      function Go(){
  4.          var content=document.title;
  5.          var firstChar=content.charAt();
  6.          var sub=content.substring(,content.length)
  7.          document.title=sub+firstChar;
  8.          //console.log(content)
  9.  
  10.      }
  11.      setInterval('Go()',);

跑马灯

  1.  <!DOCTYPE html>
  2.  <html>
  3.  <head lang="en">
  4.    <meta charset="UTF-8">
  5.    <title>Django静态网页测试</title>
  6.  
  7.    <style>
  8.      .gray{
  9.          color:gray;
  10.      }
  11.      .black{
  12.          color:black;
  13.      }
  14.  
  15.    </style>
  16.    <script type='text/javascript'>
  17.    //关键字搜索
  18.      function Enter(){
  19.          var id=document.getElementById('tip');
  20.          id.className='black';
  21.          if(id.value=='请输入关键字'||id.value.trim()==''){
  22.              id.value='';
  23.          }
  24.  
  25.      }
  26.      function Leave(){
  27.          var id=document.getElementById('tip');
  28.          var val=id.value;
  29.          id.className='black';
  30.          if(val.length==||id.value.trim()==''){
  31.              id.value='请输入关键字';
  32.              id.className='gray'
  33.              }
  34.          else{
  35.              id.className='balck';
  36.              }
  37.       }
  38.     </script>
  39.  </head>
  40.  <body>
  41.  
  42.   <h1>主标题</h1>
  43.  
  44.  <table>
  45.    <tr><td>序号</td><td>名称</td></tr>
  46.    <tr><td></td><td>Hbase实战</td></tr>
  47.    <tr><td></td><td>Lucene in Action</td></tr>
  48.  </table>
  49.  </br></br>
  50.  搜索：<input type='text' class='gray' id='tip' value='请输入关键字' onfocus='Enter();'  onblur='Leave();'/>
  51.  </br>
  52.  </br>
  53.  </br>
  54.  
  55.  用户名：<input type='text' id='t1' name='username' />
  56.  </br></br>
  57.  <div id='t2' name='pwd'>hello world!</div>
  58.  <!--
  59.  <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>
  60.  -->
  61.  <script type="text/javascript">
  62.      var name="server";  //#局部变量
  63.      age=;             /*#全局变量*/
  64.      //for
  65.      var names=['alex','tony','rain'];
  66.      for(var i=;i<names.length;i++){
  67.         console.log(i);
  68.         console.log(names[i]);
  69.      }
  70.      console.log('----------')
  71.      for (var index in names){
  72.          console.log(names[index]);
  73.      }
  74.      //alert('123');
  75.      console.log('----------')
  76.      var name2={'name':'alex','age':}
  77.      for(var index in name2){
  78.  
  79.          console.log(index);
  80.          console.log(name2[index]);
  81.      }
  82.       //while
  83.       //while()
  84.       var name3='alex'
  85.       var age3=;
  86.       //swithc,case
  87.       console.log('----------')
  88.       switch (name3){
  89.          case '':
  90.  
  91.              age3=;
  92.              console.log(age3)
  93.              break;
  94.          case '':
  95.              age3=;
  96.              console.log(age3)
  97.              break;
  98.          default:
  99.             age3=;
  100.             console.log(age3)
  101.       }
  102.  
  103.       //自执行函数
  104.        (function(arg1){
  105.          //alert(arg1);
  106.          console.log(arg1);
  107.          })('text')
  108.      console.log('----------')
  109.      //面向对象
  110.  
  111.      function Foo(name,age){
  112.          this.name='name';
  113.          this.age=age;
  114.          this.Func=function(arg){
  115.          return this.name+arg;
  116.          }
  117.      }
  118.      var obj=new Foo('alex',);
  119.      var ret=obj.Func(' so-easy');
  120.      console.log(ret);
  121.      /*
  122.      alert('this is alert')
  123.      confirm('this is confirm')
  124.      */
  125.      //DOM
  126.      var obj=document.getElementById('t1')
  127.      obj.innerText
  128.      obj.innerHTML
  129.      console.log(obj)
  130.      console.log(obj.innerText)
  131.      console.log(obj.innerHTML)
  132.  
  133.  </script>
  134.  
  135.  </body>
  136.  </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. AngularJS：一行JS代码实现控件验证效果

    如上图所示,我们需要实现如下这些验证功能: 控件都是必输控件 都需要控制最大长度 第一次打开页面,控件不能显示为错误状态 输入内容再清空后,必输控件需要显示为错误状态 只有所有输入合法后,发布按钮才能 ...

  2. keras 与tensorflow 混合使用

    keras 与tensorflow 混合使用 tr:nth-child(odd) > td, .table-striped tbody > tr:nth-child(odd) > t ...

  3. Android 四大组件学习之ContentProvider五

    上几节学习了ContentProvider的实际用途,读取短信.插入短信,读取联系人.插入联系人等. 本节课在学习ContentProvider的观察者. 在生活中有第三方的软件.比方什么短信软件.此 ...

  4. c# POST和GET方式通过server地址提交数据

    1:POST方式提交: <strong><span style="font-size:14px;">private static string HttpPo ...

  5. MFC小程序003------MFC使用WebBrowser组件，在对话框中创建滚动视图，动态创建一个静态文本控件并设置鼠标单击的消息响应

    MFC小程序截图: 一.在MFC中简单使用WebBrowser的ActiveX插件的方法: 见博文:  http://blog.csdn.net/supermanking/article/detail ...

  6. Deep Learning Toolboxs

    一些好用的 Deep learning toolboxs DeepLearningToolbox MATLAB实现,能够使用CPU或GPU.GPU运算用gpumat实现.改动内核代码很方便 支持主要的 ...

  7. 虚函数的特点就是执行的时候会下降到子类去执行同名覆盖函数 good

    var t: TBitBtn;begin t:=TBitBtn.Create(nil); t.Name:='BitBtn100'; t.parent :=Self; // 这里下断点end; 一路跟踪 ...

  8. maven变量

    一.pom文件,maven内置变量 ${basedir} 项目根目录 ${project.build.directory} 构建目录,缺省为target ${project.build.outputD ...

  9. 杂项：JavaScript

    ylbtech-杂项:JavaScript JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广 ...

  10. 如何修改vos2009/vos3000的web端口？

    vos 2009. VOS 3000 2120 -2138版本在这里 /usr/apache-tomcat-5.5.15/conf 编辑 server.xml 找到 <!-- Define a ...