zoukankan      html  css  js  c++  java
  • javascript 动态操作Html

    <html>
            <body>
              <p>aaaaa</p>
              <input type="button" value="confirm"/>
              <div id=”mydiv”> some text </div>
              <input type=”radio” value=”red” name=”color” id=”colorRed”>
              <input type=”radio” value=”green” name=”color” id=”colorGreen” testatr=”testvalue”>
            </body>
    </html>

    1.获得html标签

    var html=document.documentElement

    var html=document.childNodes[0]

    var html= document.firstChild

    2. 获得body标签

    var body= document.body

    3. 获得文档标题

    var title= document.title;

    document.title=”new titile”;

    4. 获得URL,Domain,Referrer,及跨域问题

    var url= document.URL;//获得浏览器地址栏中完整的URL信息

    var domain= document.domain;//获取该页面的域名

    var referrer=document.referrer;//表示连接到此页面的URL地址信息,可为空。

    对于页面中包含其他子域的框架或内嵌框架时,由于javascript 无法跨域访问,此时可以设置referrer属性来解决跨域问题。

    假设www.test.com内某页面加载了来自p2p.test.com的内嵌框架,可以将domain 设置为test.com来解决跨域问题。

    具体可以参考http://www.cnblogs.com/rainman/archive/2011/02/20/1959325.html

    5. 根据id获得元素

    var div= document.getElementById(“mydiv”); //仅返回文档中第一次出现的元素。

    6. 根据tag name 获得元素

    var img= document.getElementsByTagName(“img”);//返回HTMLCollection

    7. 根据name属性获得元素

    var radio=document.getElementsByName(“color”);

    8. 其他特殊的集合

    document.anchors: 包含name特性的所有<a> 元素

    document.forms :所有<form>元素,同document.getElementsByTagName(“form”)

    document.images : 所有<img> 元素集合

    document.links : 所有含href特性的<a> 元素

    9. 获取自定义属性值

    var q= document.getElementById(“mydiv”).getAttribute(“testatr”);

    10.创建元素

    var div=document.createElement(“div”);

    div.id=”newdivid”;

    div.className=”box”;

    document.body.appendChild(div);

    11. 动态javacript,css

    <script type=”text/javascript” src=”client.js”></script>

    或<script type=”text/javascript”>

    function sayhi(){

             alert(“hi”);

    }

    </script>

    var script =document.createElement(“script”);

    script.type=”text/javascript”;

    script.src=”client.js”或

    var function=”function sayhi(){alert(‘hi’);}”;

    try{

    script.appendChild(document.createTextNode(“function”));

    }catch(ex){

    script.text=”function”;

    }

    document.body.appendChild(“script”);

    考虑到不同浏览器兼容性,汇总如下:

    <script type="text/javascript">
    function loadscript(url){
        //<script type=”text/javascript” src=”client.js”></script>
        var script =document.createElement(“script”);
        script.type=”text/javascript”;
        script.src=url;
        document.body.appendChild(script);
    }
    function loadscripttext(code){
        //<script type=”text/javascript”>
        //function sayhi(){alert("hi");}
        //</script>
        var script =document.createElement(“script”);
        script.type=”text/javascript”;
        try{
                script.appendChild(document.createTextNode(“function”));
            }catch(ex){
                //IE 视script为特殊元素,不允许修改script子节点
                script.text=”function”;
            }
        document.body.appendChild(script);
    }
    
    function loadstyle(url){
        //<link rel="stylesheet" type="text/css" href="style.css">
        var link =document.createElement(“link”);
        link.rel="stylesheet";
        link.type=”text/css”;
        link.href=url;
        var head =document.getElementsByTagName("head")[0];
        head.appendChild(link);
    }
    function loadstyletext(css){
        //<style type=”text/css”>
        //body{background-color:red}
        //</style>
        var style =document.createElement(“style”);
        style.type=”text/css”;
        try{
                style.appendChild(document.createTextNode(css));
            }catch(ex){
                //IE 视style为特殊元素,不允许修改style子节点
                style.text=css;
            }
        var head =document.getElementsByTagName("head")[0];
        head.appendChild(link);
    }
    </script>
  • 相关阅读:
    ExecuteScalar requires the command to have a transaction when the connection assigned to the command is in a pending
    如何从vss中分离程序
    String or binary data would be truncated
    the pop3 service failed to retrieve authentication type and cannot continue
    The POP3 service failed to start because
    IIS Error he system cannot find the file specified _找不到页面
    pku2575Jolly Jumpers
    pku2940Wine Trading in Gergovia
    pku3219二项式系数
    pku1029false coin
  • 原文地址:https://www.cnblogs.com/yidifanhua/p/5414831.html
Copyright © 2011-2022 走看看