-专注于互联网、网络技术、网络工程、网络营销SEO、搜索引擎、社会化网络、IT技术、网络编程、网络安全、服务器管理、网站开发、移动互联网软件应用等领域的原创IT科技博客,欢迎喜欢互联网的朋友一起交流!

HTML5.JS文件-让IE浏览器支持HTML5标准(可完美支持新增语义标签)

 自HTML5标准的提出就得到非常多的关注,而作为全球使用用户最多的IE浏览器能够支持HTML5标准也是大家备受关注一个问题,让IE(包括IE6)支持HTML5元素,我们需要在HTML头部添加以下JavaScript,这是一个简单的document.createElement声明,利用条件注释针对IE来调用这个js文件。Opera,FireFox等其他非IE浏览器就会忽视这段代码,也不会存在http请求。

zblog(asp版)修改各个页面显示不同侧栏的方法

第一种就是是修改模板,不调用侧栏的标签<#template:sidebar#> ,但如果不调用的话,后台就管理不了侧栏了,这种方法不建议使用。
第二种就是我下面讲的方法了。
方法如下:
主题中默认每个页面调用的是 <#template:sidebar#>, 所以我们只需要在模板文件里default.html,catalog.html,page.html ,single.html 这四个文件里调用的侧栏标签(<#template:sidebar#> )弄成不一样的就行了。
比如说 首页default.html调用 <#template:sidebar#>, 分类页catalog.html调用 <#template:sidebar2#>,文章页 single.html 调用 <#template:sidebar3#>, 独立页调用 <#template:sidebar4#>就可以实现每个页面不一样的侧栏了。

js实现选中的目录改变样式(如背景颜色)

js实现选中的目录改变样式(如背景颜色)即当前点击的目录加上一个特定的样式,当点击其他目录是,则将该样式从该目录移除并加到被点击的新目录上。

如图a,b,c三个网页

其中a.html代码如下:

 .current{
  background:blue;
  color:#fff;
}
 
<div >
                     <ul id="menu">
                    <li><a href="#">a</a></li> 
                    <li><a href="b.html">b</a></li>
                    <li><a href="c.html">c</a></li>
                    </ul>
                    </div>aaaaaaaaaa
<script type="text/javascript">
 
function InitMenu(){
    var _menu = document.getElementById("menu").getElementsByTagName("li");
    var _page =window.location.pathname;
    if(_page=='/'){_menu[0].className='current';return}
    for(i=0;i<_menu.length;i++)
    {
        if(_menu[i].getElementsByTagName("a")[0].href.indexOf(_page)!=-1){_menu[i].className='current';break;}
    }
}
InitMenu();
</script>

b.html和c.htmlcss样式和js都不变,html部分改变如下

 <div >
                     <ul id="menu">
                    <li><a href="a.html">a</a></li> 
                    <li><a href="b.html">b</a></li>
                    <li><a href="c.html">c</a></li>
                    </ul>
                    </div>bbbbbbbbbbbbbb

 这样就可以实现js实现选中的目录改变样式。

效果图:

php中如何调用javascript中的变量

这个问题纠结了很久,如果用document.write输出则不在一个文档流中,如果用ajax看了下还真的不适合用在这种场合,用http请求又需要跳转页面,跳回去又得跳回来,更是不行,最后再想想,原来也可以在本页跳来跳去啊,那就完了,就等于刷新了,搞定,代码如下

<?php
//echo "<input type=button value=111 onclick=aa()>";
echo "<script>function aa()
{var my_name='11111111';
alert('wewew');
window.location.href='demo.php?my_name='+my_name;}
</script>";
echo $_GET['my_name'];
?>

<form name="form1">
<select name="file_source" size="1" id="file_source"  onChange=aa()>
 <option selected value=""></option>
 <option value="办公室">办公室</option>
 <option value="机房">机房</option>
 <option value="教研室">教研室</option>
 <option value="开发室">开发室</option>
</select>
</form>

判断Html元素select中的option选项被选中

<form name="form1">
<select name="file_source" size="1" id="file_source"  onChange="alert(document.form1.file_source.options[document.form1.file_source.selectedIndex].value)">
 <option selected value=""></option>
 <option value="办公室">办公室</option>
 <option value="机房">机房</option>
 <option value="教研室">教研室</option>
 <option value="开发室">开发室</option>
</select>
</form>

//从上面这段代码可以看出:判断Html的一个select的哪个option被选中 可以使用 document.form1.file_source.selectedIndex来得到

DOM精髓详解

DOM精髓详解
DOM:document object model 文档对象模型
一.document:指的是HTML,XML文档,只有这2种文档支持以下操作。
二.object:指的是js对象,基于对象操作,可以对该对象操作其,内容,属性,样式。
   1.将document转成js对象,基于对象操作。
    通过元素名(标签名),元素id,元素name使用document对象方法可以做到,

obj=document.getElementById("元素id") ;objs=document.getElementsByName("元素name");

objs=document.getElementsByTagName("标签名")
   2.操作对象内容
     obj.innerText(innerHTML)="内容";
   3.操作对象属性
     obj.属性名="属性只";例如obj.href="http://www.baidu.com";
   4.操作对象样式。
     ①单个样式:对象名.style.样式属性=样式值。
      obj.style.style.backgroundColor="red";//规则和css类似,但遇到“-”将其去掉,首字母大写
     ②多个样式:对象名.className="样式名"。
      obj.className="content";其中.content{ css }
三.model:将文档看成树形结构,每一个元素即为一个节点(元素,文本,属性,注释,文档),只要知道一个

节点,按照关系可以找到其他节点。
   名词释义:其实就是属性名
   parentNote 父节点
   childNote  子节点
   firstChild 第一个子节点
   lastChild  最后一个子节点
   nextSibling 下一个同胞节点
   previousSibling 上一个同胞节点
   节点包括:节点类型(nodeType),节点名(nodeName),节点值(nodeValue):
   元素节点的nodeName为该元素的标签名,无节点值.
   属性节点的nodeName为属性名称,节点值为属性值
   文本节点的nodeName永远是“#text” 节点值为文本内容
   文档节点的nodeName永远是“#document” 无节点值

   nodeType属性可以返回节点类型:
   元素类型:   节点类型:
    元素            1
    属性            2
    文本            3
    注释            8
    文档            9
obj.firstChild.nodeName //获取第一个子节点名
obj.childNodes.length//获取子节点的长度
obj.firstChild.nodeName//获取第一个子节点名
obj.childNodes[0].nodeName
.............
四.文档流操作
objs=document.getElementById("rr");//转化一个div标签到对象objs,通过id
obj=document.createElement("a");//创建一个a节点
obj.href="http:liuweiwei.org";//为该节点添加属性
obj.innerHTML="TTF的家园";//a标签加文本
objs.appendChild(obj);//objs对象添加子节点(a标签)

DOM简体中文参考手册

DOM参考手册 


Anchor 对象


 Anchor 对象代表一个 HTML 超链接。在 HTML 文档中 <a> 标签每出现一次,Anchor 对象就会被创建。锚可用于创建到另一个文档的链接(通过 href 属性),或者创建文档内的书签。

 

Anchor 对象的属性


 属性描述: 

l          accessKey 设置或返回访问一个链接的快捷键。

l          charset 设置或返回被链接资源的字符集。

l          coords 设置或返回逗号分隔列表,其中包含了图像映射中一个链接的坐标。

l          href 设置或返回被链接资源的 URL

l          hreflang 设置或返回被链接资源的语言代码。

l          id 设置或返回一个链接的 id

l          innerHTML 设置或返回一个链接的内容。

l          name 设置或返回一个链接的名称。

l          rel 设置或返回当前文档与目标 URL 之间的关系。

l          rev 设置或返回目标 URL 与之间当前文档的关系。

l          shape 设置或返回图像映射中某个链接的形状。 

l          tabIndex 设置或返回某个链接的 Tab 键控制次序。

l          target 设置或返回在何处打开链接。

l          type 设置或返回被链接资源的 MIME 类型。

标准属性:

l          className 设置或返回元素的 class 属性。

l          dir 设置或返回文本的方向。

l          lang 设置或返回元素的语言代码。 

l          title 设置或返回元素的 title

属性说明:

1accessKey 属性可设置或返回访问一个链接的键盘按键。请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。

语法:

anchorObject.accessKey=accessKey

实例:  document.getElementById('w3').accessKey="w"

 2tabIndex 属性可为链接设置或返回 tab 键控制次序。

语法:anchorObject.tabIndex=tabIndex

实例:下面的例子可更改三个链接的 tab 键控制次序:

function changeTabIndex()  {

  document.getElementById('1').tabIndex="3"

  document.getElementById('2').tabIndex="2"

  document.getElementById('3').tabIndex="1"

 }

3target 属性可设置或返回在何处打开链接。

语法:

anchorObject.target=_blank|_parent|_self|_top 四个保留的目标名称:

  • _blank - 在一个新的未命名的窗口载入文档

  • _self - 在相同的框架或窗口中载入目标文档

  • _parent - 把文档载入父窗口或包含了超链接引用的框架的框架集

  • _top - 把文档载入包含该超链接的窗口,取代任何当前正在窗口中显示的框架


实例:document.getElementById('myAnchor').target="_blank";

 

Anchor 对象的方法


 

方法描述:

l          blur() 把焦点从链接上移开

l          focus() 给链接应用焦点

 

Body 对象


 

Body 对象代表文档的主体 (HTML body)

 

Body 对象的属性


 
属性描述:

l          className 设置或返回元素的 class 属性 

l          dir 设置或返回文本的方向

l          id 设置或返回 body id 

l          lang 设置或返回元素的语言代码

l          title 设置或返回元素的咨询性的标题

 

Button 对象


 

Button 对象代表一个按钮。在 HTML 文档中 <button> 标签每出现一次,Button 对象就会被创建。

 

Button 对象的属性


 

属性描述: 

l          accessKey 设置或返回访问某个按钮的快捷键。

l          alt 设置或返回当浏览器无法显示按钮时供显示的替代文本。

l          disabled 设置或返回是否禁用按钮。 

l          form 返回对包含按钮的表单的引用。 

l          id 设置或返回按钮的 id 

l          name 设置或返回按钮的名称。 

l          tabIndex 设置或返回按钮的 Tab 键控制次序。 

l          type 返回按钮的表单类型。 

l          value 设置或返回显示在按钮上的文本。

属性说明:

1disabled 属性可设置或返回是否禁用按钮。

语法:

buttonObject.disabled=true|false

实例:document.getElementById("myButton").disabled=true

 

2form 属性可返回对包含该按钮的表单的引用。如果包含该按钮,则返回一个 form 对象,如果未包含该按钮,则返回 null

语法:

buttonObject.form

实例:下面的例子可返回该按钮所属的表单的 id

<p>The form containing the button is:

<script type="text/javascript">

x=document.getElementById('button1');

document.write(x.form.id);

</script></p>

 

3type 属性可返回表单元素的类型。对于一个 Buttom 对象,则永远是 "button" 类型。

语法:

buttonObject.type

实例:alert(document.getElementById("myButton").type)

 

Button 对象的方法


 

方法描述: 

l          blur() 把焦点从元素上移开。 

l          click() 在某个按钮上模拟一次鼠标单击。 

l          focus() 为某个按钮赋予焦点。

 

Checkbox 对象


 

Checkbox 对象代表一个 HTML 表单中的一个选择框。在 HTML 文档中 <input type="checkbox"> 每出现一次,Checkbox 对象就会被创建。

 

Checkbox 对象的属性


属性描述: 

l          accessKey 设置或返回访问 checkbox 的快捷键。 

l          alt 设置或返回当浏览器不支持 checkbox 时供显示的替代文本。 

l          checked 设置或返回 checkbox 是否应被选中。 

l          defaultChecked 返回 checked 属性的默认值。 

l          disabled 设置或返回 checkbox 是否应被禁用。 

l          form 返回对包含 checkbox 的表单的引用。 

l          id 设置或返回 checkbox id 

l          name 设置或返回 checkbox 的名称。 

SHOPEX与ECSHOP比较

SHOPEX与ECSHOP是目前国内流行的两款PHP网上商店系统。一个是老牌劲旅,一个是后起之秀,由此,很多网友都开始不由自主地将“SHOPEX ”与“ECSHOP”之间进行比较。虽然“SHOPEX”发展多年功能已比较完善,而“ECSHOP”的横空出世是否能够抢占用户的眼球,积蓄实力以期能与“SHOPEX”一较高低呢?在下文中将通过各项功能比较来窥视“SHOPEX”与“ECSHOP”孰优孰劣。(备注:这里的shopex指ShopEx网上商店系统)

一、代码免费及开源

SHOPEX:ShopEx网上商店系统提供免费下载、免费使用、免费升级,没有使用时间和功能上的任何限制,与商业版本一样。但是SHOPEX是经过优化,后台源码是加密的,前台源码是开源的。

SHOPEX后台界面

ECSHOP:ECSHOP则是一款开源免费的通用电子商务平台构建软件,用户可以根据自己的商务特征对ECSHOP进行定制,增加自己商城的特色功能。

ECSHOP后台界面

点评:SHOPEX和ECSHOP同样免费;前且的小信使、提醒工具、后台生成静态页面的文件都是经过加密处理的,只支持前台开源,不利于用户的修改和二次开发。而ECSHOP且完全支持开源,在这点上ECSHOP占据了上方,我们也相信,在将来的某一天,SHOPEX也实现开源。

二、支付网关

SHOPEX:目前SHOPEX内置银联、快钱、支付宝等国际国内三十四个网上支付网关。无需另行制作网关接口,用户自由选取合适的网关,快速实现网上在线支付功能。

SHOPEX内置支付网关

ECSHOP:以插件方式提供对支付网关的支持,用户可以自行选择所需的支付方式。ECSHOP内置了银联、快钱、支付宝等国内较为常用的六个支付网关。

如何让你的网站通过web标准验证

web标准是www.w3.org制定的标准,其中有html的标准和css的标准。要达到标准,就需要规范的写代码:
1.XHTML 1.0文件类别宣告的正确写法 (不可小写)
A:过度标准(Transitional)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
B:框架标准(Frameset)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
C:严格标准(Strict)
包含以上须注意的问题,还有其他更严格的标准
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd
2.头文件问题
所有的网页头文件都一律都改为W3C标准形式,写法如下:
<head>
<meta http-equiv="content-type" c />
<meta http-equiv="content-language" c />
<meta name="keywords" c />
<meta name="description" c/>
<title>...</title>
</head>
3.不允许使用target="_blank"
在HTML4.01可以使用target="_blank",但XHTML1.0是不被允许的.
比如原来这样写的代码:<a href="document.html" target="_blank"> 打开一个新窗口</a>
现在需要写成这样:<a href="document.html" rel="external">打开一个新窗口</a>
这是符合strict标准的方法。
当然还必须配合一个javascript才有效。javascript完整的代码JS如下:
function externallinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=0; i<anchors.length; i++) {
var anchor = anchors;
if (anchor.getAttribute("href") &&
anchor.getAttribute("rel") == "external")
anchor.target = "_blank"; }
}
window.onload = externallinks;
然后把它保存成一个.js文件(比如open.js),再通过外部联接方法调用:
<script type="text/javascript" src="external.js"></script>
4.XHTML 1.0要求所有的标识必须关闭
«1»
搜索
网站分类
最近发表
文章归档

技术支持TTF的家园

Copyright www.ttfde.org. All Rights Reserved.站点统计 Design by TTF的家园