Question

以下工作代码从头部获取所有元标记，并在网页上显示div内的文本。在keyup上，我想复制输入文本val并替换头元描述并更新div，以便我可以看到文本已从前端正确输入。

我遇到的两件事：

复制输入文本框的新值并替换元名称的“内容”=“description”content =“添加新文本”（div内）
复制输入文本框的val并替换头部元描述的“内容”

下面的一些代码：

 <h2>Meta Description</h2>
    <!-- I have head meta tags inside the below div to read the tags on the web page -->
    <div class="all">some text</div>

<!-- input text on keyup to 1. update head meta description, 2 update meta description inside the div (<div class="all">some text</div>) -->

<input type="text" name="metadescription" id="metadescription" />

<!-- this part of jquery is working -->
<script type="text/javascript">

var foo = '';

$("head meta").each(function () {
    foo += $(this).clone().wrap('<div>').parent().html();
});

//alert(foo); 
var b = $('.all').text(foo);


// the below is part is not quite working
$description = $('.all').find('meta[name=description]').attr('content');

$('#metadescription').keyup(function(){
  //  $('.all').find($description).text($(this).val());
    //the below just replace all the text, but I want it to replace the 'content'
    $('.all').text($(this).val());
    //alert(foo); 



});

</script>

我得到了这个工作，很大一部分感谢softsdev的大部分代码：））

* 以下是完整的工作代码!!!! **

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="This is the meta description of some sort" >
<meta name="keywords" content="some, content, added" >
<title>change meta content</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
    $( document ).ready(function(){
        $('.content').keyup(function(){
            $('meta[name=description]').attr('content', $(this).val());
        });


    });

</script>
</head>

<body>



    <h2>Meta Description</h2>

<div class="all">some text</div>
    <h4>Update meta description</h4>
<input type="text" name="content"  class="content"/>

<script type="text/javascript">
$('.content').keyup(function(){

    $('.all').text('<meta name="description" content="'+$(this).val()+'">');

});


$('.all').append(($('meta[name=descritption]').attr('content')));
var tt = jQuery.metadata.get(name=descritption)
   $('.all').text(tt);
   $('meta[name=description]').attr('description').insertAfter('body');
</script>

<script language="JavaScript">
if (document.getElementsByName) {

  var metaArray = document.getElementsByName('description');
  for (var i=0; i<metaArray.length; i++) {
   // document.write(metaArray[i].content + '<br>');
            $('.all').text('<meta name="description" content="'+ metaArray[i].content +'">' );

  }

}
</script>

</body>
</html>

Answer 1

你可以像example

那样做

更改

$('.all').text($(this).val());

与

$('.all').text('<meta http-equiv="content-type" content="'+$(this).val()+'">');

更新了答案

如果您想在HTML中执行此操作，那么您可以尝试这一点并检查firebug内容是否会更改元标记

但它只会反映在客户端

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="This is the meta description of some sort" >
<meta name="keywords" content="some, content, added" >
<title>change meta content</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
    $( document ).ready(function(){
        $('.content').keyup(function(){
            $('meta[name=description]').attr('content', $(this).val());
        });
    });

</script>
</head>

<body>
    <input type="text" name="content"  class="content"/>
</body>
</html>

在keyup上，更新元描述

1 个答案: